구글 블로거 다루기 #수동으로 카테고리 만들기 (HTML/JavaScript) : kuzuro

블로거의 자체 기능으로 카테고리를 추가했었는데, 이건 기능적인 제한이 있었습니다. 가장 먼저 느껴지는건 순서를 정할 수 없다는점입니다.

또한, 쉽게 접할 수 있는 블로그 서비스들처럼 '카테고리'와 '태그'가 분리되어있는듯한 느낌이 들도록 하겠습니다.

관리자 화면 → 레이아웃에서 HTML/JavaScript를 선택합니다.

HTML편집 모드에서 코드를 직접 입력합니다. 햇갈릴 수 있는데, 입력칸의 우측 상단에 '서식있는 텍스트'라고 되어있으면 현재 HTML편집 모드입니다.

<ul>

<li><a href="[태그1의 URL]">[태그1의 이름]</a></li>

<li><a href="[태그2의 URL]">[태그2의 이름]</a></li>

<li><a href="[태그3의 URL]">[태그3의 이름]</a></li>

</ul>

원하는 순서대로 작성합니다.

블로그 사이드바에 작성해던대로 카테고리(가칭)이 출력됩니다.

태그 가젯의 수정창으로 이동합니다.

'라벨별 블로그 포스트 숫자 표시'를 선택하고, 저장 버튼을 클릭합니다.

원래 있던 태그에 태그별로 작성된 게시물의 갯수가 표시됩니다. 새로 추가한 카테고리(가칭)에도 마찬가지로 게시물 갯수를 표시할 수 있도록 수정하겠습니다.

먼저 카테고리(가칭)의 ID를 확인합니다.

마찬가지로 태그의 ID를 확인합니다.

</body> 바로 위에 스크립트를 작성합니다.

<script>

//<![CDATA[

var cate = document.getElementById("HTML1").querySelectorAll("li");

var label = document.getElementById("Label1").querySelectorAll("li");

var label_cnt = document.getElementById("Label1").querySelectorAll("li span");



for(var i = 0; i < label.length; i++){

 for(var j = 0; j < cate.length; j++){

 

  if(label[i].querySelector("a").getAttribute("href") == cate[j].querySelector("a").getAttribute("href")) {

   var cnt = label_cnt[i].innerHTML;

   cate[j].querySelector("a").outerHTML = cate[j].innerHTML + " " + cnt;

        }

    }

}

//]]>

</script>