* 본 포스트에 사용된 소스는 티스토리 카테고리 글 더보기 플러그인 외에도 JavaScript를 이용해 클래스명으로 엘리먼트를 찾을 때 사용할 수 있습니다.
* 글 더보기 플러그인 위치 바꾸기의 경우, 블로그 출력 글 개수가 2개 이상일 때 제대로 적용되지 않을 수 있습니다. 이런 분은 다음 링크의 개선된 팁을 참고하시기 바랍니다. http://blog.missflash.com/543
티스토리를 사용하면서 불편한 점 중 하나는 플러그인의 위치나 디자인을 마음대로 편집하지 못하는 것입니다.
(물론 PHP 파일을 사용하지 못한다는 훨씬 큰 단점이 있긴 하지만, 무료 블로그 서비스에서 이것까지 바란다는 것은 너무 염치가 없기에... ^^;)
그 중 하나가 바로 카테고리 글 더보기1 플러그인인데요... 이 플러그인의 경우, 출력되는 게시물의 수나 색상 등을 편집할 수는 있지만 플러그인의 위치를 수정할 수는 없습니다.
제 경우, 처음에는 카테고리 글 더보기 플러그인의 위치가 크게 상관이 없었습니다만... 믹시 추천 위젯이나 다음 블로거뉴스 추천 위젯, 그리고 Krang님이 만드신 메타사이트 추천 아이콘 등을 추가하니 플러그인의 위치를 바꾸고 싶더군요...
그런데 티스토리 플러그인은 skin.html에 표시되지 않기 때문에 코드를 직접 수정할 수는 없고, 자바스크립트를 이용해 이미 출력된 HTML 태그를 수정(즉, 서버단에서 소스를 수정해서 보내는 것이 아니라, 서버로부터 받은 소스를 클라이언트단에서 수정한 후 출력하는 것이죠...) 해야하겠더군요... 하지만, 역시 문제는 귀차니즘;;;
그러다가 오늘 여러가지 추천 위젯들을 하나로 합치면서 그동안 미뤄왔던 카테고리 글 더보기 플러그인의 위치를 바꿔버렸습니다. 몇 차례의 시행착오 끝에 완성한 주옥같은 기능(?)이니 필요하신 분들은 마음껏 사용해 주시기 바랍니다.
(아래의 소스를 자신의 스킨에 맞게 수정하는 것은 관계없으나, Copyright 부분은 빼지 말아 주세요 ㅎㅎ;)
1. 먼저 아래 자바스크립트 소스를 <head></head> 태그 사이에 붙여넣습니다.
2. 다음으로 아래 소스를 카테고리 글 더보기 플러그인이 출력되기 원하는 곳에 붙여넣습니다.
<div id="MF_Reference" class="another_category another_category_color_gray">카테고리 글 더보기 플러그인의 위치</div>
<script type="text/javascript">var ref_source = getElementsByClass("another_category"); document.getElementById("MF_Reference").innerHTML = document.getElementById("MF_Reference").innerHTML + ref_source;</script>
<script type="text/javascript">var ref_source = getElementsByClass("another_category"); document.getElementById("MF_Reference").innerHTML = document.getElementById("MF_Reference").innerHTML + ref_source;</script>
위 코드에서 MF_Reference라는 ID의 div가 카테고리 글 더보기 플러그인의 위치가 됩니다.(위 코드에서 another_category와 <div>, <script type="text/javascript"> 태그의 순서는 변경하시면 안됩니다.)
일단, 제 블로그에서는 정상작동2했는데... 테스트해보시고 문제가 있거나 궁금한 점이 있으면 댓글남겨주시기 바랍니다. :)
'Tip&Tech > Tistory' 카테고리의 다른 글
| [팁] 티스토리에서 믹시&블로거뉴스 추천 위젯, 카테고리 글 더보기 위치 설정하기!!! (168) | 2009.05.12 |
|---|---|
| [팁] 티스토리에서 믹시와 다음 블로거뉴스 추천 위젯 통합하기!!! (94) | 2009.04.11 |
| 레퍼러 로그로 확인해 본 다음 트래픽의 비밀 (12) | 2009.03.16 |
| 티스토리, 이제는 나가라는 뜻인가? (2) | 2009.03.08 |
| [팁] 티스토리에서 외부 링크(External Link) 사용하기! (6) | 2009.02.25 |
