+ more/less 태그
<a href=#none onclick=this.innerHTML=(this.nextSibling.style.display=='none')?'글숨기기':'다시_보기';this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';>내용의 제목</a><DIV style='display:none'>본문</div>
<a href=#none onclick=this.innerHTML=(this.nextSibling.style.display=='none')?'글숨기기':'다시_보기';this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';>내용의 제목</a><DIV style='display:none'>본문</div>
+ more/less 간단 태그
<a href='javascript:void(0)' onclick=this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';>클릭</a><DIV style='display:none'>
내용</DIV>
<a href='javascript:void(0)' onclick=this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';>클릭</a><DIV style='display:none'>
내용</DIV>
+ 글박스 상세
<div style="BORDER-RIGHT: black 1px dotted; PADDING-RIGHT: 9px; BORDER-TOP: black 1px dotted; PADDING-LEFT: 9px; PADDING-BOTTOM: 9px; BORDER-LEFT: black 1px dotted; WIDTH: 100%; COLOR: black; PADDING-TOP: 9px; BORDER-BOTTOM: black 1px dotted; BACKGROUND-COLOR: #eeeeee; TEXT-ALIGN: left">본문</div>
<div style="BORDER-RIGHT: black 1px dotted; PADDING-RIGHT: 9px; BORDER-TOP: black 1px dotted; PADDING-LEFT: 9px; PADDING-BOTTOM: 9px; BORDER-LEFT: black 1px dotted; WIDTH: 100%; COLOR: black; PADDING-TOP: 9px; BORDER-BOTTOM: black 1px dotted; BACKGROUND-COLOR: #eeeeee; TEXT-ALIGN: left">본문</div>
+ 불펌 방지용 드래그 금지
<body ondragstart="return false" onselectstart="return false"> 내용 </body>
이 내용으로 스킨 소스의 본문 html "<div class="content"><$postcont$></div>"를 감싸준다.
(참고 - 1회성 드래그 금지의 경우 : <p ondragstart="return false" onselectstart="return false"> 내용 </p> )
<body ondragstart="return false" onselectstart="return false"> 내용 </body>
이 내용으로 스킨 소스의 본문 html "<div class="content"><$postcont$></div>"를 감싸준다.
(참고 - 1회성 드래그 금지의 경우 : <p ondragstart="return false" onselectstart="return false"> 내용 </p> )
+ 이메일 주소 아이콘 생성 페이지
http://services.nexodyne.com/email/index.php
http://services.nexodyne.com/email/index.php
+ 컴퓨터 자동 전원 OFF 실행
일단 시작버튼을 누르시고 "실행" 을 눌러주십니다. 그런 다음 shutdown -s -t [초], 즉 1분 후 꺼지게 하고싶다하면 60이고 2분 후라면 120이 되겠죠? 1시간 후에 꺼지게 하고 싶다면 60 x 60 = 3600 이므로 shutdown -s -t 3600
( t 다음에 한 칸 공백 있습니다 ← 주의 ) 이렇게 하면 1시간 후에 자동으로 전원이 꺼집니다. -s 대신 -r 넣으면 리부팅이 이루어지구요. 잠잘 때 조각모음 켜놓고 1시간 후에 꺼지게 한다거나 영화나 게임 다운받고 있는데 친구가 술마시자고 할 때 등등 유용하게 쓰실수 있을 겁니다 ㅡㅡ;;;; 참고로 shutdown -a 로 취소할 수 있습니다. ( 30분 = 1800 초, 1시간 = 3600 초, 2시간 = 7200 초, 3시간 = 10800 초, 10시간 = 36000 초 )
일단 시작버튼을 누르시고 "실행" 을 눌러주십니다. 그런 다음 shutdown -s -t [초], 즉 1분 후 꺼지게 하고싶다하면 60이고 2분 후라면 120이 되겠죠? 1시간 후에 꺼지게 하고 싶다면 60 x 60 = 3600 이므로 shutdown -s -t 3600
( t 다음에 한 칸 공백 있습니다 ← 주의 ) 이렇게 하면 1시간 후에 자동으로 전원이 꺼집니다. -s 대신 -r 넣으면 리부팅이 이루어지구요. 잠잘 때 조각모음 켜놓고 1시간 후에 꺼지게 한다거나 영화나 게임 다운받고 있는데 친구가 술마시자고 할 때 등등 유용하게 쓰실수 있을 겁니다 ㅡㅡ;;;; 참고로 shutdown -a 로 취소할 수 있습니다. ( 30분 = 1800 초, 1시간 = 3600 초, 2시간 = 7200 초, 3시간 = 10800 초, 10시간 = 36000 초 )
+ 링크 이미지 테두리 제거
<a href="http://www.naver.com" onfocus="this.blur()">
<img src="http://static.naver.com/common/lg/naver03.gif" border=0></a>
border=0 은 링크걸린 이미지에 파란테두리가 생기지 않게 하고,
onfocus="this.blur()" 는 클릭했을 때 점선테두리가 생기지 않게 합니다.
<a href="http://www.naver.com" onfocus="this.blur()">
<img src="http://static.naver.com/common/lg/naver03.gif" border=0></a>
border=0 은 링크걸린 이미지에 파란테두리가 생기지 않게 하고,
onfocus="this.blur()" 는 클릭했을 때 점선테두리가 생기지 않게 합니다.
+ 쉬운 태그 입력기 ( Powered by Allblog )
http://www.allblog.net/Tags/TagHelper.aspx
http://www.allblog.net/Tags/TagHelper.aspx
+ fieldset 으로 여러가지 테이블 box 만들기 ( Powered by redhotman )
( 출처 : http://blog.naver.com/redhotman/60001288566 )
<body>와 </body>사이의 원하시는 곳에 박스 밑의 붉은부분의 소스를 넣어 주시면 됩니다.
<fieldset>테이블이 아닙니다.</fieldset>
<fieldset><legend align="center">여긴 제목</legend>여긴 내용을</fieldset>
<fieldset style="width:300; height:20">박스의 크기를 따로 지정해 줄 수도 있습니다.</fieldset>
<fieldset style="border:1 solid #9FB6FF">테두리의 두께, 모양, 색상을 지정합니다.</fieldset>
<fieldset style="padding:5">여백도 넣습니다.</fieldset>
<fieldset style="border:1 solid navy; background: url(bg.gif) no-repeat right bottom; width:300; height:200; padding:15"><legend align="center">제목</legend>내용</fieldset>
1은 테두리 굵기, navy는 테두리 색, bg.gif는 배경그림의 경로 및 이름
300은 박스의 가로 크기, 200은 박스의 세로 크기, 15는 박스 내부의 여백 을 나타냅니다...
공지로 사용해도 좋겠죠???^^
( 출처 : http://blog.naver.com/redhotman/60001288566 )
<body>와 </body>사이의 원하시는 곳에 박스 밑의 붉은부분의 소스를 넣어 주시면 됩니다.
<fieldset>테이블이 아닙니다.</fieldset>
<fieldset><legend align="center">여긴 제목</legend>여긴 내용을</fieldset>
<fieldset style="width:300; height:20">박스의 크기를 따로 지정해 줄 수도 있습니다.</fieldset>
<fieldset style="border:1 solid #9FB6FF">테두리의 두께, 모양, 색상을 지정합니다.</fieldset>
<fieldset style="padding:5">여백도 넣습니다.</fieldset>
<fieldset style="border:1 solid navy; background: url(bg.gif) no-repeat right bottom; width:300; height:200; padding:15"><legend align="center">제목</legend>내용</fieldset>
1은 테두리 굵기, navy는 테두리 색, bg.gif는 배경그림의 경로 및 이름
300은 박스의 가로 크기, 200은 박스의 세로 크기, 15는 박스 내부의 여백 을 나타냅니다...
공지로 사용해도 좋겠죠???^^
+ 간단 색깔 박스 ( Powered by 샐리 )
( 출처 : http://haime.egloos.com/571976 )
( 출처 : http://haime.egloos.com/571976 )
<div style="border:1px solid #AECDFF; padding:9px; color:blue;background:#E7EFF7;">
<div style="border:1px solid silver; padding:9px; background:#EEE;">
<div style="border:1px solid TAN; padding:9px; background:IVORY;">
<div style="border:1px solid #FAC6C6; padding:9px; background:#FFF0F5;">
<div style="border:1px solid #4BAF4B; padding:9px; background:#E4FFDA;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/01/2/bg_1.gif); border:1px solid SILVER; padding:9px;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/01/2/bg_2.gif); border:1px solid LIGHTSKYBLUE; padding:9px;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg1.gif); border:1px solid SILVER; padding:9px;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg2.gif); border:1px solid TAN; padding:9px;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg3.gif); border:1px solid #FAC6C6; padding:9px;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg4.gif); border:1px solid #AECDFF; padding:9px;">
<div style="background-IMAGE : URL(http://md.egloos.com/skn/img/a/01/00/5/bg5.gif); border:1px solid #4BAF4B; padding:9px;">
+ 메모장 내용 메뉴 구분할 때
<div class=mnttl>Sub menu</div> 과 같은 식으로 넣어준다. ( 우상단 메모장 내용 소스 )
Sub menu자리에 메뉴 이름으로 쓰고 싶은 문구를 삽입
<div class=mnttl>Sub menu</div> 과 같은 식으로 넣어준다. ( 우상단 메모장 내용 소스 )
Sub menu자리에 메뉴 이름으로 쓰고 싶은 문구를 삽입
+ 스킨 수정팁 여러가지 ( Powered by 샐리 )
출처 : 샐리의 오두막 - 샐리 (스킨 카테고리)
+ 좁아서 답답했던 덧글창 키우기 ( 펼치기
이 올리버네 화이트 스킨 소스를 살펴보다가 알게 된 건데, 이 스킨 제작자분이 다음과 같은 소스를 이용해서 덧글창 크기를 키우셨더군요.
이 박스의 내용물을 카피해서 css 창 아무데나 붙여넣어보세요.
굵은글씨로 된 부분의 숫자를 변경하면 창의 사이즈가 바뀝니다.
)
+ 본문 좌우 폭 넓히기 ( 페이퍼 스킨 )
+ 헤드에 자주 쓰는 태그 자동복사 및 링크 넣기 ( 펼치기
천조제 님의 다중 접기 스크립트 복사기능을 보고 삘받은바 되어 작성해본 팁 되겠다.
원출처인 다라니 님의 다중 접기용 스크립트 복사 기능을 메뉴에 달았다.를 보면, 포스트 작성시 자주 쓰는 태그인 more/less 태그를 자바스크립트를 이용해서 버튼 한번만 누르면 바로 클립보드로 복사되도록 만든 팁이 있다. 매우 멋졌다.
다만 여기서 조금 아쉬운 점이, 그 복사 기능 버튼과 새글쓰기 버튼이 멀리 떨어져 있다는 것이었다. (이분의 팁은 메모장 기능을 이용해서 오른쪽이나 왼쪽의 서브메뉴에 다는 팁이다.) 이런 more/less 태그는 새글 쓸 때 필요한 것이니 기왕이면 새글쓰기 버튼 옆에 있으면 더 좋지 않을까?
그래서 아예 새글쓰기 버튼 옆에 '접기 태그 복사 버튼'을 만드는 팁을 마련해 보았다.
1. 현재 사용중인 스킨 편집창으로 들어간다.
2. html 창을 보면
이런 부분이 있을 것이다. (adminmenu type는 1$일 수도 있고 2$ 3$...일 수도 있다)
3. 색깔 부분을 첨가한다. (모두 한줄로 붙일 것.)
4. 저장한다.
그러면
에서
이렇게 되어 있을 것이다.
▲ 마우스를 대면 풍선 도움말이 뜬다.
5. 새글 쓰기 전에 저 "more/less 태그 복사하기"를 한번 누르면 클립보드에 more/less 태그가 저장된다.
6. 새글 쓰기로 들어가서 ctrl+v 로 붙여넣기 하면 OK.
단 이때
이런 식으로 두줄로 나뉘어 붙여질 것이다. 이러면 태그가 제대로 먹지 않으므로 이것을
이렇게 한줄로 반드시 붙여줄것. )
+ 여러 Tip 포스트에 색깔 박스 소스 추가
출처 : 샐리의 오두막 - 샐리 (스킨 카테고리)
+ 좁아서 답답했던 덧글창 키우기 ( 펼치기
이 올리버네 화이트 스킨 소스를 살펴보다가 알게 된 건데, 이 스킨 제작자분이 다음과 같은 소스를 이용해서 덧글창 크기를 키우셨더군요.
/* 코멘트 입력 폼 */
div.commet_input table { width: 578px !important;}
div.comment_input textarea { width: 578px !important; height: 150px !important; }
div.commet_input table { width: 578px !important;}
div.comment_input textarea { width: 578px !important; height: 150px !important; }
이 박스의 내용물을 카피해서 css 창 아무데나 붙여넣어보세요.
굵은글씨로 된 부분의 숫자를 변경하면 창의 사이즈가 바뀝니다.
+ 본문 좌우 폭 넓히기 ( 페이퍼 스킨 )
+ 헤드에 자주 쓰는 태그 자동복사 및 링크 넣기 ( 펼치기
천조제 님의 다중 접기 스크립트 복사기능을 보고 삘받은바 되어 작성해본 팁 되겠다.
원출처인 다라니 님의 다중 접기용 스크립트 복사 기능을 메뉴에 달았다.를 보면, 포스트 작성시 자주 쓰는 태그인 more/less 태그를 자바스크립트를 이용해서 버튼 한번만 누르면 바로 클립보드로 복사되도록 만든 팁이 있다. 매우 멋졌다.
다만 여기서 조금 아쉬운 점이, 그 복사 기능 버튼과 새글쓰기 버튼이 멀리 떨어져 있다는 것이었다. (이분의 팁은 메모장 기능을 이용해서 오른쪽이나 왼쪽의 서브메뉴에 다는 팁이다.) 이런 more/less 태그는 새글 쓸 때 필요한 것이니 기왕이면 새글쓰기 버튼 옆에 있으면 더 좋지 않을까?
그래서 아예 새글쓰기 버튼 옆에 '접기 태그 복사 버튼'을 만드는 팁을 마련해 보았다.
1. 현재 사용중인 스킨 편집창으로 들어간다.
2. html 창을 보면
<DIV CLASS=USERMENU><$adminmenu type=1$></DIV>
이런 부분이 있을 것이다. (adminmenu type는 1$일 수도 있고 2$ 3$...일 수도 있다)
3. 색깔 부분을 첨가한다. (모두 한줄로 붙일 것.)
<DIV CLASS=USERMENU><a title="클릭하면 MoreLess 태그가 클립보드에 저장됩니다" href=javascript:void(0); onclick='javascript: window.clipboardData.setData("Text",document.getElementById("tag").innerHTML);'>more/less 태그 복사하기</a><div id="tag" style="display:none;"><a href='javascript:void(0)' onclick=this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';>클릭</a><DIV style='display:none'>내용 쓰는 곳</div></div> | <$adminmenu type=1$>
4. 저장한다.
그러면
에서
이렇게 되어 있을 것이다.
5. 새글 쓰기 전에 저 "more/less 태그 복사하기"를 한번 누르면 클립보드에 more/less 태그가 저장된다.
6. 새글 쓰기로 들어가서 ctrl+v 로 붙여넣기 하면 OK.
단 이때
<A onclick="this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';" href="javascript:void(0)>클릭</A>
<DIV style='display:none'></div>
<DIV style='display:none'></div>
이런 식으로 두줄로 나뉘어 붙여질 것이다. 이러면 태그가 제대로 먹지 않으므로 이것을
<A onclick="this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';" href="javascript:void(0)>클릭</A><DIV style='display:none'></div>
이렇게 한줄로 반드시 붙여줄것.
+ 여러 Tip 포스트에 색깔 박스 소스 추가
+ 추가 ( 04/01 ) - 헤드에 자주 쓰는 태그 자동복사 및 링크 넣기에서
헤드에 자동 복사할 태그 값 하나가 아니라 여러 개 넣을 경우 각각의 div id 값을 다르게 맞춰줘야 한다. 예를 들어 다음과 같은 코드가 있다고 할 때 한 번을 tag라고 줬다면 다음 값은 tag2라는 식으로 .. 이렇게 구별을 해 줘야 각각 다르게 구별되어 들어감. ( 이걸 몰라서 살짝 헤맸다는 )
<a title="클릭하면 MoreLess 태그가 클립보드에 저장됩니다" href=javascript:void(0); onclick='javascript: window.clipboardData.setData("Text",document.getElementById("tag").innerHTML);'>More&Less</a><div id="tag" style="display:none;"> 이 부분이 클립보드에 저장될 부분임 </div>
※ <div id="tag" style="display:none;"> ~ </div> 이 태그가 없으면 해당 코드 그대로 구현되어 버리니 주의할 것. </div>로 태그 뒤 막아주는 걸 잊지 맙시다. ( 깜빡하면 usermenu가 사라져 버리는 황당한 꼴을 .. )
헤드에 자동 복사할 태그 값 하나가 아니라 여러 개 넣을 경우 각각의 div id 값을 다르게 맞춰줘야 한다. 예를 들어 다음과 같은 코드가 있다고 할 때 한 번을 tag라고 줬다면 다음 값은 tag2라는 식으로 .. 이렇게 구별을 해 줘야 각각 다르게 구별되어 들어감. ( 이걸 몰라서 살짝 헤맸다는 )
<a title="클릭하면 MoreLess 태그가 클립보드에 저장됩니다" href=javascript:void(0); onclick='javascript: window.clipboardData.setData("Text",document.getElementById("tag").innerHTML);'>More&Less</a><div id="tag" style="display:none;"> 이 부분이 클립보드에 저장될 부분임 </div>
※ <div id="tag" style="display:none;"> ~ </div> 이 태그가 없으면 해당 코드 그대로 구현되어 버리니 주의할 것. </div>로 태그 뒤 막아주는 걸 잊지 맙시다. ( 깜빡하면 usermenu가 사라져 버리는 황당한 꼴을 .. )
( 이어지는 예시 - 클릭해서 보시라 )
이런 소스가 있다면
이런 식으로 div id값 구별해줘야 함.(적색 사각형, 청색 사각형)
녹색 밑줄은 클립보드에 저장될 코드 내용.
녹색 밑줄은 클립보드에 저장될 코드 내용.
+ 메인화면 Notice소스 ( 06/06/21 ) - 스킨소스 메인프레임 <$egloourl$> 바로 다음에 삽입
<DIV CLASS=POST>
<DIV CLASS=POST_HEAD>
<TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 WIDTH=745>
<TR><TD WIDTH=100% ALIGN=LEFT><DIV CLASS=POST_TTL><center>알리는 말씀</center></DIV></TD></TR>
</TABLE>
</DIV>
① 이유를 막론하고 <strong><span style="COLOR: #ff0000">광고덧글과 욕설은 금지</span></strong>합니다. 통보없이 삭제합니다. ② <strong><span style="COLOR: #ff0000"><u>무단</u>스크랩 및 원문<u>편집</u> 불허</span></strong>합니다. 출처 절대 명기하시고 방명록에 남겨주세요. ③ 비로그인 유저이든 로그인 유저이든 상관하지 않습니다. 단 <strong><span style="COLOR: #ff0000">최소한의 매너</span></strong>는 지켜주세요. </DIV>
+ 형광펜색 마킹
이런 색깔로 칠해집니다.
소스 : <span style="BACKGROUND-COLOR: #e4ff75"></span>
이런 색깔로 칠해집니다.
소스 : <span style="BACKGROUND-COLOR: #e4ff75"></span>
+ 간단 들여쓰기 태그
<ul>내용</ul> : 첫번째 들여쓰기
<ol>내용</ol> : 두번째 들여쓰기
<Li>내용 : 머릿글 가운데점
- 예시 - 현재 <Li 태그>들여쓰기 된 상태입니다1
- 예시 - 현재 <Li 태그>들여쓰기 된 상태입니다4 (+ Li 태그 )
- 예시 - 현재 <Li 태그>들여쓰기 된 상태입니다5 (+ Li 태그 )
예시 - 현재 <Li 태그>들여쓰기 된 상태입니다2
예시 - 현재 <Li 태그>들여쓰기 된 상태입니다3
- 예시 - 현재 <Oi 태그>들여쓰기 된 상태입니다a
예시 - 현재 <Oi 태그>들여쓰기 된 상태입니다b
예시 - 현재 <Oi 태그>들여쓰기 된 상태입니다c
참고용 포스트 :) ( 수시 업데이트 )
'IT > 각종 TIP' 카테고리의 다른 글
| 불펌 방지용 드래그 금지 소스 (8) | 2006/02/18 |
|---|---|
| 동영상 무한 계정!!! (64) | 2006/02/14 |
| 여러 TIP (3) | 2005/12/05 |
| 태터툴스 0.96 정식버전 업데이트 (10) | 2005/08/13 |
| 0.96 COUNTDOWN RELEASE CANDIDATE (3) | 2005/08/07 |
| 한줄메모장 + 보낸 트랙백 표시 소스 추가 (2) | 2005/06/08 |
