오른쪽 사이드바를 보면 아시겠지만 얼마전에 태그구름 모듈을 바꿨습니다.
요거 달려있는 블로그를 많이 봤는데 어떻게 하는건지 당췌 감이 안왔답니다.
그러다가 검색(저는 모를 땐 물어보자. 그거 쪽팔린거 아니다 라고 생각합니다)을 통해서 자세한 정보를 얻게 되었습니다.
3D 태그 구름 달기 (WP Culumus)
해당 포스트에 자세히 설명이 되어 있어서 그것만 보셔도 적용 가능 하실겁니다.
후니님의 블로그에서 대부분의 정보(필요한 파일, 소스 등)를 얻을 수 있었고 바로 시도를 해봤습니다.
근데..... 요기서 문제가 생겼습니다.
바로 치환자가 사라져서 한참을 고민했답니다.
치환자에 대한 설명은 여기
뭔가를 설명하면서 소스코드를 포스트에 쓰게되면 치환자는 꼭 사라진답니다.
그 때문에 많은 분들이 코드를 입력한 텍스트파일을 따로 업로드 한다던지 highlighter를 사용하는거죠.
그래서 저도 highlighter를 설치한다고 꾸준히 삽질했구요.
다행히 티스토리 스킨가이드의 치환자에 대한 내용을 참고해서 빠진 치환자를 넣고 블로그에 적용할 수 있었답니다.
제발!!!!! 다른 프로그램등의 설치 없이도 소개하고자 하는 소스코드가 입력한 그대로 보여지게 해줬으면 좋겠습니다~~~~!!!
본론으로 돌아와서
지금부터의 설명은 티스토리 블로그를 기준으로 하겠습니다.
기타 설치형 블로그는 위에 링크되어 있는 후니님의 포스트를 참고하시면 될거에요~
두개의 파일(swfobject.js, tagcloud.swf)이 필요한데요. 압축을 푸시고 두개의 파일을 스킨업로드 페이지에 업로드 하세요~
소스코드에 파일 경로를 스킨업로드 경로로 지정했는데 다른 곳에 업로드 하시면 경로를 바꿔야하니 번거롭잖아요.ㅎㅎ
3D 태그구름.zip
소스코드를 붙여넣을 위치를 먼저 알려 드려야 할 것 같아서 사이드 바에 대한 설명을 먼저 간단히 드릴게요.
그림에서 주황색으로 표시된 부분이 하나의 모듈이 되는거죠. 저건 검색모듈이네요.
그러면 어느 위치에 넣느냐. 하나의 모듈이 끝나는 부분과 다음 모듈이 시작되는 사이에 들어가면 되죠.
위에서는 주황색 아래 파란색 사이에 넣으면 되겠죠?
또는 사이드바 모듈의 가장 처음이나 마지막에 넣어도 상관 없습니다. 사이드바 설정에서 위치를 바꾸면 되니까요.
highlighter를 이용해 소스를 게재했다가 제 블로그 url이 포함되어서 그부분을 수정하시는 분들이 계시더라구요.
생략된 소스가 추가된 highlighter의 특성때문에 오해의 소지가 있으니 텍스트 파일로 대체합니다.
아래의 소스를 'skin.html'의 사이드바 부분에 붙여 넣으시면 됩니다.
소스.txt코드를 보시면 색상을 원하는 대로 바꿀 수 있는데요.
| #FFFFFF | 배경색 |
| tcolor, 0x3C5A91 | 글자색 |
| hicolor, 0xff99ff | 마우스 오버시 글자색 |
| tcolor2, 0xF0E68C | 인기태그 색 |
각각의 테이블 배경 색이 해당색상코드 색이구요. 바꾸시려면 위의 코드중 파란색으로 굵게 표시한 6자리만 원하시는 색상코드로 바꿔주세요.
다시한번 후니님께 감사드립니다.
3D 태그구름이 적용된 모습입니다.
