블로거(블로그스팟) 카테고리 기능 만들기

텍스트 큐브 닷컴에서 이전한 후에 다른 기능들은 모두 대체할 수 있었으나 카테고리 기능만큼은 대체하지 못했다. 그래서 오늘 카테고리 기능을 구현하기 위해 구글링을 해보니 좋은 스크립트를 발견했다.

스크립트의 기능은 라벨 별로 블로그의 제목을 나타내는 것이다. 이전부터 카테고리 기능을 만들게 된다면 라벨로 분류를 해야 할 것 같아서 미리 라벨 별로 카테고리를 만들었는데, 이 스크립트가 카테고리 구현에 딱 맞았다.

(혹시 카테고리 구현을 하지 않고 라벨 클릭을 통해 글을 보고자 한다면 라벨(레이블, 태그) 선택 시 보여주는 글 개수 제한하기 방법을 사용하는 것도 좋다.)

먼저, 글 목록을 보여주기 위한 페이지를 만들기 위해서 블로거의 기능이 페이지 생성을 통해서 글 목록을 위한 페이지를 만들었다.

그 다음 http://www.bloggersentral.com/2010/04/list-recent-posts-by-label.html에 있는 스크립트를 사용해서 페이지에 글을 적으면 된다.

사용 방법은 HTML 편집을 선택한 후 위 사이트의 스크립트를 복사해서 붙여 넣는다. 그 다음 YOUR_BLOG_URL를 자신의 블로그 주소로 바꾸고, YOUR_LABEL를 자신의 라벨 명으로 바꾼다. 이때 레이블 명은 블로그에서 라벨을 클릭 했을 때 나타나는 것으로 표현 해주어야 한다. 예를 들어, "Linux/Kubuntu 도움글"과 같이 이것을 그대로 적으면 안되고, 라벨을 클릭 했을 때 나타나는 주소에서 "Linux%2FKubuntu 도움글"와 같은 부분을 적어야 한다.

그 다음 SHOW_HOW_MANY에는 최대로 표시한 글의 수를 적으면 되는데, 최대 500까지 적을 수 있다. 그 이상에 대해서는 댓글에 적으라고 되어 있는데, 이미 댓글에 해결 방법이 나와 있는 것 같다.

이렇게 수정을 하면 일단 라벨 1개에 대해서는 완성이고, 추가적인 라벨에 대해서는 스크립트의 21번째 줄만 복사해서 같은 방법으로 수정해주면 된다.

그러면 페이지에 글 목록이 나타나게 된다. 그리고 글이 너무 많을 경우에는 21번째 줄 스크립트를 펼치기/접기 코드로 감싸주면 펼치기/접기 기능을 사용할 수 있다.


그러나 아직 라벨을 클릭하게 되면 이 글 목록이 나타나지 않는데, 라벨을 클릭했을 때 글 목록으로 페이지를 옮겨가도록 하는 것은 템플릿 수정과 앵커 기능을 통해 가능하다. 꾸미기 탭에서 HTML 편집을 누른 다음 가젯을 펼치고, data:label.url 부분을 "[카테고리 주소]#" + data:label.name로 바꾸어 준다. [카테고리 주소]는 글 목록을 보여주는 페이지의 주소를 적어주면 된다.

이렇게 하면 일단, 라벨을 클릭했을 때 글 목록이 나타나는 페이지로 옮겨지게 된다. 그러나 클릭한 라벨로 화면을 이동하려면 앵커 기능을 추가해줘야 하는데, 카테고리가 있는 페이지 수정에서 각 라벨의 <a> 태그(펼치기/접기를 넣었을 경우이다. 만약 넣지 않았다면 직접 태그를 삽입하면 된다.) 내에 id="[라벨 이름]"을 넣어주면 된다. 이때 [라벨 이름]은 위에서 언급한 것처럼 변경할 필요 없이 그대로 넣어주면 된다.

이렇게 하고 나면 라벨을 클릭 했을 때 자동으로 글 목록 쪽으로 이동하게 된다.

*** 참고로 이상하게 스크립트를 넣은 후 페이지 수정을 하게 되면 스크립트가 작동을 하지 않는다. 이때는 다시 21번째 줄 위의 스크립트 부분만 복사해서 붙여 넣어주면 된다.

댓글 4개:

  1. '라벨(레이블, 태그) 선택 시 보여주는 글 개수 제한하기'를 사용하면 라벨 기능이 먹통이 되고
    '글 목록을 보여주기 위한 페이지'를 만든 후 페이지를 클릭하면 목록이 아닌 빈 페이지만 뜨네요.
    이러한 착오가 왜 발생하는 건지 알 수 있는 방법 없을까요? 혹시 스킨에 영향을 받는다거나 그런 경우는 없나요?

    답글삭제
  2. └ 라벨 선택시 글 개수 제한하는 기능은 저 역시 여전히 작동하는 것 같습니다. 라벨을 누른 후 주소창에 ?max-results=2와 같이 붙여주면 글이 2개만 나옵니다.

    그리고 페이지 만드는 경우도 지금 작동하고 있는데, 스킨의 영향 같지는 않습니다.
    최근에 블로그 스팟 쪽에서 추가된 '동적뷰' 레이아웃들이 있는데, 그러한 쪽에서 사용을 할 경우에는 작동이 잘 되는지 모르겠습니다.

    카테고리 기능 쪽에서 제쪽 코드는 아래처럼 되어 있습니다.

    b:if cond='data:blog.url == "http://bluekyume.blogspot.com/p/blog-page_9229.html#" + data:label.name'

    답글삭제
  3. data:label.url 부분 이라는 것은 'data:label.url'와 일치하는 모든 문자열 부분을 뜻하는 게 아닌 것 같네요. 맞나요?
    다른곳에서 지적을 받았는데, 피드 허용 상태로 설정을 한 후 다시 작성했더니 이제 되는 것 같습니다.

    답글삭제
  4. └ 아, 블로그 feed 설정을 해두어야 카테고리 기능이 작동합니다.

    피드에 있는 글에 대해서 제목을 가져오는 스크립트이기 때문에 그렇습니다.

    답글삭제