2009년 9월 1일 화요일

텍스트큐브 사이드바에 플래쉬 태그 적용하기

요것이 사이드바 태그 구름


 위에 사진이 깜군이가 사용하는 사이드바 태그 구름입니다. 티스토리에서 사용하던것인데 원 소소는 BLUEnLIVE 님이 공개해주신 겁니다.

 사실 저는 웹소스에 대해 어떤 교육도 받지 못한 무뇌한입니다. 그래서 저것을 텍스트큐브에 적용하기는 쉽지 않았습니다. 왜? 냐면, 티스토리에서는 스킨편집시 파일업로드에서 웬만한 파일은 다 쉽게 업로드 되지만, 텍스트큐브는 제한이 있습니다.

 위에 플래쉬 태그를 적용하기위에서는 swfobject.jstagcloud.swf 이 두파일이 필요한데, 텍스트큐브에서는 요 두 파일을 올릴 수가 없는겁니다. 이것은 제가 뚫을 수 없는 벽이 였습니다. 혼자 무지하게~ 고민하다. 답은 의외로 간단하게 위 두파일은 다른계정에 있어도 상관없겠다 는 결론을 내리고 적용해서 성공했습니다. T.T

 간단한 혼자 삽질 프로젝트를 공개해 드리겠습니다.

<s_sidebar_element>
<!-- 태그목록 모듈 -->
<div class="tagbox widget">
<h3>태그 구름</h3>
<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://zoc.kr">BLUEnLIVE</a> requires Flash Player 9 or better.</p></div>
<script type="text/javascript" src="http://업로드주소/swfobject.js"></script>
<script type="text/javascript">
var t = new SWFObject("http://업로드주소/tagcloud.swf", "tagcloud", "100%", "200", "7", "#FFFFFF");
t.addVariable("tcolor", "0x222222");t.addVariable("hicolor", "0x3C5A91");t.addVariable("tcolor2", "0xF0E68C");
t.addVariable("mode", "tags");t.addVariable("distr", "true");t.addVariable("tspeed", "100");t.addParam("allowScriptAccess", "always");
t.addVariable("tagcloud", document.getElementById('htags').innerHTML.replace(/&amp;/gi, ' ').replace(/class=([\w]+)/gi, 'class="$1"').replace(/\"\"/gi, '"').replace(/class=\"/gi, 'style=\"font-size:').replace(/:cloud([\d])/gi, ':1$1pt;').replace(/TAGS\>/gi, 'tags>').replace(/\<A\s/gi, '<a ').replace(/\<\/A\>/gi, '</a>').replace(/\"/g, "'"));
t.write("TiCumulus");
</script>
</div>
</s_sidebar_element>


 위 소스가 그냥 제가 갖다가 붙인 것입니다.

 빨간색글자가 swfobject.js 와 tagcloud.swf 주소입니다. 제가 좀 얌체같이 쓰지않는 티스토리 계정에 올렸습니다. 혹시 사용해보고 싶으신 분들은, 아무계정이나 두파일을 올린후 올린 주소를 빨간색 글자부분을 지우고 사용하시면 되겠네요.

 그리고 제가 편집한 제 스킨에는 원래 태그목록이 사이드바에 없었습니다. 하지만 사이드바가 나열된 곳에 위 소스를 그냥 갖다붙이니 적용이 되네요.^^

 추가적으로 #FFFFFF는 배경색입니다.
 
 0x222222
태그의 기본색입니다. 바꾸시려면 0x웹색상표를 해주시면 되겠습니다. 웹색상표는 검색하면 잘 나옵니다.^^

  0xFF3333 은 마우스커서를 올렸을때 나타나는 색상입니다.

 0xF0E68C 는 인기태그 색상인데, 제가 인기있는 태그가 없어서 적용될런지는 잘 모르겠네요 ^^

 아무쪼록 저처럼 스킨 혼자 고치기 삽질 프로젝트를 하시는 분들에게 도움이 되었으면,
 합니다.

 #추가사항
 
 혹시 스킨을 수정하였는데, 나오질 않을경우!! 위젯관리에서 태그목록 모듈이 새로 생겼을 겁니다. 그걸 사이드바에 드래그해서 적용시켜주세요.

댓글 없음:

댓글 쓰기