구글 블로그 카테고리 만들기 - 1편. 태그 가젯을 이용한 카테고리 제작법

처음 구글 블로그 blogger 를 시작했을 때, 제일 먼저 네이버 블로그나 카페에서 보던 카테고리 기능이 어디 있나 찾아보았지만, 원하던 카테고리는 안보이고 대신 날짜 별로 뭉뚱그려진 못난 블로그 보관함 가젯뿐이 없었습니다.

좌 - 네이버 블로그                                                 우 - 네이버 카페

못난 구글 블로그 카테고ㅗㅗㅗ리ㅡㅡ

어떻게 방법이 없을까 머리를 쥐어뜯어ㄱ… 지는 않고, (모발은 소중하니까요) 그냥 머리를 감싸고 생각해본 결과! 엄청난 아이디어가 떠올랐지만, 일단 다른 블로거들은 어떻게 했을까 염탐하러 가봤습니다. 물론 엄-청나게 대단한 아이디어가... 떠올랐지만, 그래도... 우선 다른 블로그를... 일단... ...

*주의! 지나친 Copycat은 예기치 않은 놀라움을 선사할 수 있습니다.

무튼, 다른 블로거들의 블로그를 간단히 살펴본 결과 대부분 얼추 비슷한 방법을 사용하는 것을 발견했습니다.

바로 태그 가젯을 사용하여 짝퉁 카테고리를 만드는 방법!입니다

태그 가젯을 그냥 사용하면 각 글에 붙인 별 잡다한 태그들이 다 튀어나오게 됩니다.

하지만, 태그 가젯에서 표시란에 선택한 라벨만 표시가 되도록 체크를 하면 특정 단어라벨이 태그로 달린 글만 표시가 되도록 할 수 있습니다.

예를 들어, 제목을 일상으로 바꾸고 블로그 제작기 라벨만을 선택한 결과 아래 화면과 같이 태그에 블로그 제작기 라는 라벨이 붙은 글들만 표시가 되는걸 확인할 수 있었습니다.

같은 방법으로 새로운 태그 가젯을 이용하여 게임 카테고리에 롤과 폴아웃 또한 만들어 보았습니다. 

비록 네이버 블로그나 네이버 카페보다 디자인이 깔끔하다거나 제작이 간편하다고는 못하지만, 그래도 카테고리 제작에 있어 전혀 어렵지 않고 사용성과 기능에 있어 꽤나 만족스러운 결과물을 만들 수 있었습니다.

하지만!! 제가 생각했던 카테고리 제작 아이디어는 태그 가젯을 사용하는 방법은 아니었다는 거!

... 사실 태그 가젯으로 만든 카테고리보다 깔끔한 카테고리를 제작할 수 있을지는 미지수고, 확실히 훨씬 만들기 번거로울 것 같지만, 한번 실험을 해 볼까 합니다. 

그럼, 카테고리 만들기 2편 페이지 가젯을 이용한 카테고리 만들기로 돌아오겠습니다.

구글 블로그 글 목록(Post list) 만들기 - 본문 상단에 글 목록을 만들어 보았습니다.

아무래도 네이버나 티스토리(?)와 같은 타 블로그에 너무 익숙해져 있나 봅니다.
글 목록도 없이 바로 본문이 나오니까 허전하고, 심지어 불편하기까지 합니다.

목록을 추가할 수 없을까 구글에 검색해보기로 합니다.
역시 없는 거 빼고 다 나오는 구글 검색답게 한방에 원하는 결과가 나옵니다.
[Blogspot] Label을 이용한 글목록(Posts List) 구현.

일단 아래의 소스코드를 클릭하여 들어가서 복사합니다.
소스코드

코드를 복사하였으면 레이아웃에 들어가 가젯 추가 - HTML/JavaScript를 선택합니다.

목차, 목록, 리스트, Post list 등 원하는 제목을 입력 후,
그 아래, 내용에 위의 소스코드를 붙여넣기 해줍니다.

여기서 가장 주의하실 것은, 맨 아랫부분에 본인의 블로그 주소를 입력해야 하는 부분이 있습니다.

Ctrl + F 로 검색 탭을 열고, 

page.init('http://본인의-블로그-주소를-입력하세요.com', 5); 를 검색하신 뒤 

본인의-블로그-주소를-입력하세요 부분을 고쳐주시면 됩니다. 저 같은 경우에는

page.init('https://choitnhdailylife.blogspot.com', 5);

가 되었네요.
*주의하실 점은 .com뒤에 /가 붙어 있으면 안됩니다.

그 후, 추가된 가젯을 사이드바(Sidebar)에서 중앙 블로그 게시물 상단에 위치시켜 주시면 됩니다.

블로그 게시물 상단에 위치시켜주는 이유는, 이 코드를 제작하신 G1님께서
애초에 블로그 게시물 상단에 위치시키는걸 상정하고 코드를 제작하셨기 때문입니다.

가젯을 추가한 뒤 화면을 보니 일단은 목록이 생성되었습니다.
하지만, 잘 작동이 되나 클릭을 해보니 작동이 안됩니다...
뭐가 문제인가 한참 헤매다 보니 블로그 설정 시간대가 -인 지역이 선택되어 있다면 작동을 안한다는 글이 있더군요.
혹시나 해서 찾아봤습니다.  설정 - 언어 및 서식 - 시간대

아니나 다를까, 시간대가 태평양 표준시로 되어있었네요.
+9인 서울로 저장한 뒤 실험을 해 보니 정상작동 하는 모습을 확인할 수 있었습니다.

추가로 폰트 사이즈, 페이지 숫자의 색상, 보여지는 목록의 개수 등을 본인의 입맛에 맞게 편집하실 수 있습니다.
Ctrl + F 로 검색 탭을 열어 찾으시면 편합니다.


목록의 폰트 사이즈 & 색상 변경하기

93번 행 var a = document.createElement('a');
; 뒤에 a.style.fontSize = '10pt' 를 추가한 뒤 숫자를 변경해주면 글 목록 폰트의 사이즈를,

; 뒤에 a.style.color = '색상' 을 추가해주면 글 목록 폰트의 색을 변경 가능합니다.

본인 블로그의 테마, 색상에 따라 Blue, Yellow나 Red, 혹은 정확한 값 #FFFF00, #222222 등으로 변경하십시오.


페이지 수 폰트 사이즈 & 색상 변경하기

138 번 행 var a = document.createElement('a');
; 뒤에 a.style.fontSize = '10pt' 를 추가한 뒤 숫자를 변경해주면 목록 아래 페이지 수 폰트의 사이즈를 변경 가능하고,

144번 행 a.style.color = 'blue';
페이지 숫자를 표시하는 색(기본색상 Blue)을 다른 색으로 바꿀 수 있습니다.

한번에 보여지는 목록의 개수 변경하기

182번 행 page.init('https://본인의-블로그-주소를-입력하세요.com', 5);
본인의 블로그 주소 뒤에 숫자 5는 한번에 보여지는 목록의 개수입니다.
5를 써넣으면 5줄이, 10을 넣으면 10줄이 보이겠죠.

첫날, 테마를 선택했습니다.

사실 지금도 영 엉성하다는 느낌을 지울 수 없습니다만,

지금 이 모습까지 만드는 것도 꽤나 시간이 걸렸습니다.

처음 블로거를 시작하겠다고 하고

블로그 생성을 하기 위해 고심 끝에 타이틀과 주소를 쳐 넣고 나면 나오는 아무것도 없는 허허벌판과 같은 화면을 보면 이게 뭐지…? 싶은 기분을

아마, 저 뿐만 아니라 블로거를 처음 시작하시는 분들 모두 느끼셨을 겁니다.

뭐가 뭔가, 괜시리 들어가서 첫 뻘글도 써보고, 레이아웃도 눌러보고, 가젯이 뭔가 이것 저것 살펴보고, 그러다가 테마에 들어서야,

오! 뭔가 블로그를 만든다는 듯한 ‘느낌’을 받습니다.

이 테마 저 테마 한번씩 다 눌러보다가 답답한 마음에 HTML 편집을 눌러보지만,

HTML이니 C언어니 하는 코드는 이미 다 머나먼 기억 저 너머로…  

그냥 아쉬운 데로 맞춤설정에 들어가서 하나씩 하나씩 눌러보다가

구관이 명관이라고, 그나마 학창시절 취미 삼아 만들어봤던 네이버 블로그와 비슷한 “깔끔” 테마에

양 옆, 바닥 1줄 레이아웃을 선택하고서야 나름 만족합니다.

이 정도뿐이 안 했는데, 벌써부터 피로감이 몰려옵니다.

이 정도면 충분했어, 첫술에 배부를 순 없지. 라고 스스로 위로하면서

슬며시 블로거를 끄고 롤을 킵니다.

구글 블로그 Blogger(블로거) 시작!

호텔 일을 개인 사정으로 잠시 쉬고 있습니다만,

슬슬 일선으로 복귀 준비도 할 겸,

뭔가 일상에서 변화를 주어 나 스스로를 개발해보자!

하는 마음으로 전부터 생각해오던 블로그 운영을 시작해 보기로 합니다.

특히 요즘같이 휙휙 변하는 세상에 지금에 안주해 있으면,

남들과 같은 선상에 달리기도 힘들잖아요.

앞으로 살길이 구만리인데 말이죠.

뭐, 그래서 블로그를 시작하자 했는데
전에 써봤던 네이버 블로그와는 달리 구글 블로그 ‘Blogger’는 꽤나 어렵네요.
테마서부터, 페이지 레이아웃, 가젯은 또 뭐고, HTML 코드도 따와야 하고...

바로 구상해오던 일을 진행하기 앞서 이 블로거에서 기본기를 다져볼까 합니다.

애정을 갖고 저의 개인적인 일기장처럼 사용하면서

저처럼 같이 이제 막 블로거를 시작하시려는 분들과,

손잡고 함께 헤매며 나가고자 합니다.