구글의 블로그 서비스인 Blogger 에는 두 가지 템플릿 모드가 있는데, ‘레이아웃’과 ‘클래식 템플릿’이 바로 그것입니다. 레이아웃은 2006년 이후 Blogger가 구글에 인수된 뒤 개발된 새로운 페이지 구성 방식이고, 템플릿은 이전부터 써오던 HTML 기반의 구형 페이지 구성 방식입니다. 요새는 대부분 쉽고 간편한 레이아웃 방식을 많이 쓰지만, 저는 아직까지도 구형 템플릿 방식을 고수하고 있습니다(절대 게을러서 그런 게 맞습니다 ㅠㅠ).
아무튼 구형 Blogger 템플릿을 쓰는 저는, 예전에 Mixsh의 mixUP 위젯을 블로그에 달려고 했다 포기했던 적이 있었습니다. 처음엔 Blogger 서비스를 지원하지 않아서였고, 나중엔 신형 레이아웃 방식의 Blogger만 지원해서 포기했던 것이죠. 물론 지금도 구형 템플릿 방식의 Blogger는 공식적으로 지원하지 않습니다.
그런데 mixUP 위젯의 설치코드를 들여다보다, 문득 어떤 코드들이 눈에 띄어 그 부분을 수정해줬더니 정상적으로 설치가 되었습니다. 이번 글에선 그 방법을 소개하겠습니다.
▲ mixUP 위젯 설치를 위한 코드 생성
mixUP 위젯 페이지에서 설치할 블로그를 선택하고, 조회수 표시 옵션을 선택한 뒤, 자신이 사용중인 블로그를 선택합니다. 저는 Blogger를 사용하고 있기 때문에, Blogger를 선택했습니다. ‘확인’ 버튼을 누르면 코드가 생성됩니다. 어떻게 생긴 코드인지 볼까요?
▲Blogger(신형 레이아웃)용 mixUP 코드
자바스크립트 코드가 보입니다. post.url 이라고 적힌 문자열과 post.timestamp 등의 문자열이 보입니다. 게시물의 URL주소와 게시 시각을 추출하도록 되어있나 봅니다. blogger에 부여된 플랫폼 구분 숫자는 6이군요.
그런데 이 코드들은 Blogger의 구형 템플릿에서 사용되는 코드들이 아닙니다. 구형 템플릿의 코드들은 <$템플릿용 태그$> 와 같은 형식을 가집니다. 위 스크린샷에 보이는 코드들은 신형 레이아웃에 쓰이는 코드들이네요. 때문에 구형 템플릿을 사용하는 제 블로그에는 이 코드를 적용할 수 없습니다.
▲워드프레스용 mixUP 코드
참고 삼아, 워드프레스용 mixUP 코드를 살펴볼까요? 외부 사이트의 위젯이나 가젯 등을 설치할 때, 워드프레스용으로 제작된 코드가 있다면 Blogger 구형 템플릿용으로 수정해서 쓸 수 있습니다. 템플릿 태그 방식이 비슷하거든요. 아까 본 코드보다 이쪽이 더 깔끔하네요. URL과 게시 시각 부분을 추출하기 위한 태그가 보입니다. 워드프레스에 부여된 플랫폼 구분 숫자는 5네요.
그럼 이제, 이 코드를 가지고 Blogger 구형 템플릿에서도 동작할 수 있도록 수정해 볼까요? 노랗게 표시된 부분만 수정해주면 됩니다.
▲Blogger(구형 템플릿)용으로 수정된 mixUP 코드
Blogger 구형 템플릿에서 ‘게시물의 URL주소’ 를 표시해주는 태그는 <$BlogItemPermalinkUrl$> 입니다. ‘게시물의 게시 시각’ 을 표시해주는 태그는 <$BlogItemDateTime$> 입니다. Blogger 템플릿용 태그는 대/소문자를 구분하기 때문에, 조심해서 써줘야 합니다. 노랗게 표시된 부분을 바꿔주고, 플랫폼 숫자를 다시 6으로 바꿔줍니다. Blogger 구형 템플릿용 태그는 Blogger 도움말 사이트에서 찾아볼 수 있습니다.
완성된 코드를 Blogger 대시보드의 ‘템플릿 - HTML편집’ 에서 추가합니다. 본문 바로 아래에 넣으면 되겠군요. <ItemPage> </ItemPage> 태그를 쓰면, 게시물 페이지에서만 표시되게 할 수 있습니다. <ItemPage>태그와 </ItemPage>태그 사이에 믹시 코드를 넣으면 되겠죠?
▲ 블로그 게시물 본문 하단에 나타난 mixUP 위젯
드디어 mixUP 위젯이 정상적으로 설치되었습니다. 많이 많이 눌러주세요~
적용하시는 데 얼마나 힘이 드셨을지...
답글삭제고맙습니다.
Archmond 님 / 간단한 건데요 뭐~; 요새는 구형 템플릿 쓰는 분들도 거의 없어서 별로 유용하지도 않겠네요. 항상 관심 보내주셔서 감사합니다.
답글삭제잘보았습니다..저는 블러그만든지 얼마 안되서 신형인듯한데 믹스업 소스를 어디에 넣어야하는지 알려주실수 있나요.html 본문하단부분에 넣으라 하는데 해당하는부분을 잘 모르겠네요 부탁드립니다^^
답글삭제루시드폴 님 / 신형은 레이아웃 수정에서 고치면 되는데요, 직접 HTML을 수정해도 되지만 '레이아웃' 메뉴에서 추가할 수도 있을것 같습니다. '레이아웃'-'페이지요소' 수정 메뉴에서 '가젯 추가'를 선택하고, 'Javascripts/HTML추가' 가젯을 이용해보면 어떨가요? 직접 HTML수정 시에는 '본문' 또는 '레이블' 코드 바로 아래에 달아주면 될 것 같습니다.
답글삭제Kais님 친절한 답변 감사드립니다. 우선 HTML/JavaScript 가젯 추가로해보았는데 아무내용없이 오른쪽 옆에 설정하는 작은 아이콘만 생기는걸봐서는 만들어진듯한데 위젯추가로는 안되나봅니다.HTML설정에서 소스코드를 바디나 포스트 부분에 여기 저기 해보아도 에러메시지만 나오네요 ㅎㅎ(잘못한것일수도 있지만요 ㅜㅜ) 근데 새로운 게시물 만들고 본문 포스트HTML에서 내용 밑에 삽입하면 그포스트에는 만들어지는데 말이죠. 믹시 문의해봐도 덧글이없고 답답할뿐입니다 허허. 검색해봐도 블로거에 설치하는 내용이 전혀없어서 연관 포스트 찾다가 님 글을 보고 문의드렸는데 답변 주셔서 감사하고 더 노력을 해봐야할듯합니다 ㅜㅜ. 그럼 이만 줄일께요 ^^
답글삭제루시드폴 님 / 믹시 홈페이지에 Blogger(신형) 넣는 방법이 잘 설명되어 있으니 그쪽을 참고해 보시는게 좋을것 같습니다.
답글삭제