블로거(blogger) 태그 클라우드 꾸미기 1. tag

구글 블로그  태그 클라우드를 꾸며보겠습니다.

블로거(blogger)에는 태그·라벨을 표시해주는 가젯이 있고,

이 가젯을 이용하면, 태그를 클라우드 형식으로 나타낼 수 있습니다.

그런데, 한가지 아쉬운 점은 비주얼이 그리 만족스럽지 못하다는 것입니다. 영문과 한글, 작은 글씨와 큰 글씨 간의 조화가 잘 이루어지지 못하기 때문에 뭔가 조금 어색하고 너저분해보입니다. 영문 블로거들이 태그 가젯을 예쁘게 꾸며주는 코드들을 공유하고 있지만, 막상 적용해보면 한글과는 맞지 않는 경우가 많았습니다.

그래서 태그를 직접 한번 꾸며봤습니다. 깔끔하게, 그리고 사용자가 자신의 템플릿에 맞게 조절할 수 있게 하는데 중점을 두었습니다.

[표1]

<표.1>는 제가 작성한 코드를 적용한 모습입니다. 그리고 코드는 아래와 같습니다.

1:  .label-size {  
2:  padding: 3px;  
3:  margin: 2px;  
4:  font-size:11px;  
5:  border:1px dotted 666666;  
6:  border-radius:0px;  
7:  display:block;  
8:  float:left;  
9:  text-decoration:none;  
10:  background:ffffff;  
11:  }  

코드 적용 위치는 [대시보드→템
플릿→맞춤설정→고급→CSS추가] 입니다. 복사하실 때 코드 왼쪽의 숫자 행 표시(1: 2: 3: 등)는 삭제하시기 바랍니다.

코드를 삽입할 때는 자신의 스타일에 맞게 2·3·4·5·6·10 행을 수정하시면 됩니다.

각각의 행이 의미하는 것은 이렇습니다.  

2부에 계속 하겠습니다.

[출처]Else log