Cumulus for Tistory 1.21a 업데이트! (버그패치 포함)

태그 구름을 멋지게 출력해주는 플러그인인 Cumulus for Tistory 1.21는 사소한 버그가 있다.

@, &, + 등 일부 태그가 제대로 출력되지 않거나, 출력이 되어도 정상적으로 클릭이 되지 않는 문제다.
일부 태그를 화면에 출력하지 않는 미봉책을 사용했었는데, 이걸 모든 태그에 대해 정상동작하도록 대폭 수정했다.

이렇게 & @ '

1. 파일의 설치

아래 파일을 다운받아 압축을 풀면 swfobject.js, TiCumulus.js 그리고 tagcloud.swf 세 개의 파일이 나온다.
이  세 파일을 스킨 직접올리기 기능을 이용해서 올린다.

TiCumulus_v121a.zip

엔터튤립9 글꼴을 이용해서 만들어 파일 크기가 157KB밖에 안 됨

2. 스킨 수정 (새로 설치하는 것을 기준으로 함)

우선 헤더에 아래와 같이 두 줄을 추가한다.

<script type="text/javascript" src="./images/swfobject.js"></script>
<script type="text/javascript" src="./images/TiCumulus.js"></script>

다음으로, 스킨을 직접 편집해서 아래와 같은 내용을 찾는다.

<div id="tagbox" class="module">
  <h3>태그목록</h3>
  <div class="tagboxWrap">
  <ul>
    <s_random_tags>
    <li>
      <a href="[#\#_tag_link_#\#]" class="[#\#_tag_class_#\#]"> [#\#_tag_name_#\#]</a>
    </li>
    </s_random_tags>
  </ul>
  </div>
</div>

스킨에 따라 조금씩 모양이 다르기는 하지만, 꼭 있는 태그가 <s_random_tags>이다.
우선 수정해야하는 부분은 이 <s_random_tags> 밖에 있는 <ul>-</ul>이다.

이 부분을 아래와 같이 수정한다.

<div id="htags" style="display:none;"><tags>
  <s_random_tags>
    <a href="[#\#_tag_link_#\#]" class="[#\#_tag_class_#\#]">[#\#_tag_name_#\#]</a>
  </s_random_tags>
<a href="/"></a></tags></div>
<div id="TiCumulus"><p>Tistory Cumulus Flash tag cloud by <a href="http://zockr.tistory.com">BLUEnLIVE</a> requires Flash Player 9 or better.</p></div>
<script type="text/javascript">
//<![CDATA[
  var flashvars = {
  tcolor: "0x2970A6",
  hicolor: "0x462A56",
  mode: "tags",
  distr: "true",
  tspeed: "100",
  tagcloud: document.getElementById('htags').innerHTML.E4Cumulus()
  };
  var params = {
  allowScriptAccess: "always",
  wmode: "opaque",
  bgcolor: "#f7f7f7"
  };
  swfobject.embedSWF("./images/tagcloud.swf", "TiCumulus", "100%", "200", "9.0.0", null, flashvars, params);
//]]>
</script>

조금 길지만 소스 보기를 한 뒤에 복사하면 된다.

a. 22행의 "100%", "200"은 각각 가로, 세로의 크기임.

b. 20행의 "#f7f7f7"는 배경의 색상임.

c. 10행의 "0x2970A6"는 태그의 기본색상임.

d. 11행의 "0x462A56"는 선택된 태그의 색상임.

e. 1.21에 비해 바뀐 부분이 15행. 기존 버전에 비해 훨씬 정교하고 정확하게 변환하도록 수정되었음.

그럼 잘 쓰시기 바란다!!!

※ IE에서도 배경색이 잘 동작하도록 수정됨 (2009. 10. 19)