친효스킨 For 구글블로거 TOP버튼 추가 업데이트 안내

안녕하세요. 친절한효자손입니다. 구글 블로그로 이사하시는 분들이 점점 늘어나는군요. 피부로 느낍니다. 단순히 스킨 사용량때문에 알게된건 아닙니다. 아시죠? 티스토리 관련 유료 교육도 하고 있는것을 말입니다. 확 줄었습니다. 수강생이 말이죠. 티스토리의 애드센스 숟가락 얹기 정책으로 많은 분들께서 티스토리를 떠났습니다. 좋게 떠나면 저도 좋은데 이 정책이 멀쩡하게 운영하시는 분들에게도 타격을 줬죠. 그래서 구글 블로그를 저 역시 따로 키우는 이유이기도 하고요.

구글블로거를 만들고 배포한지도 어느덧 3개월이 지나고 있습니다. 의외로 많은 분들께서 사용을 하고 계십니다. 저는 기껏해야 5명 정도 사용하겠지 싶었는데 역시 구글 블로거의 힘은 대단했습니다. 또한 무료 스킨 중 쓸만한게 거의 없어서 거의 반 강제적으로 유료 구매를 해야 하는데 그렇다고 유료 스킨 중 마음에 드는것도 잘 없어요. 그래서 직접 만든 것입니다.

친효스킨 For 구글블로거 버전을 사용하시는 사용자분들 가운데에서 TOP버튼을 만들어줬으면 하는 의견이 있으셨습니다. TOP버튼 그까이꺼 뭐 어렵지 않죠? 금새 뚝딱 만들어버렸습니다. 지금부터 적용하는 방법을 설명드립니다. 방금도 언급했듯 이건 친효스킨 전용 TOP버튼입니다. 타스킨의 경우에는 별도로 세팅을 하셔야 할겁니다.

Code Download

우선 아래의 첨부파일을 다운로드 받습니다.

파일 다운로드

텍스트 파일이 받아졌을 것입니다. 다운로드가 완료되었다면 문서를 열어보세요. HTML과 CSS 코드가 두 개 들어있습니다. 구분선은 사용하지 마시고 나머지 코드를 모두 사용하면 됩니다.

HTML Settings

먼저 실제 버튼이 되는 HTML 태그부터 세팅해 봅시다. 첨부파일에 있는 HTML 태그를 모두 복사합니다.

구글 블로그 관리자 화면에서 테마 > 맞춤설정 옆 화살표로 들어갑니다.

HTML 편집으로 들어갑니다.

이제 검색 기능을 사용합시다. 아무 곳이나 클릭 후 Ctrl + F를 눌러 Search를 활성화 합니다. 입력란에 </body> 라고 입력 후 엔터를 눌러 해당 태그 위치를 찾습니다. 이제 복사한 HTML 코드를 바로 위에 붙여넣기 합니다. <b:template-script> 관련 코드가 있는데 그 위에 붙여넣어도 상관없고 바로 다음에 붙여넣어도 됩니다.

CSS Settings

마지막으로 CSS 세팅을 합니다. 첨부파일의 CSS 코드를 모두 복사합니다.

이번에는 Ctrl + F를 눌러서 애드센스 CSS 라고 입력 후 엔터를 눌러 해당 위치를 찾습니다. 친효스킨 For 구글블로거의 경우에는 딱 한 곳이 검색될 겁니다. 검색된 위치 바로 위에 CSS 코드를 그대로 붙여넣기 합니다.

이제 스킨을 저장합니다. 여기까지가 모든 세팅 과정이었습니다. 생각보다 어렵지 않죠? 이제 메인 화면으로 들어가서 구글블로거에 잘 적용되었는지 확인합니다.

잘 적용이 된 모습입니다. 이제 버튼을 눌러보세요. 위로 올라갈거에요. 참고로 친효스킨 For 구글블로거 Ver 1.2 이상부터는 기본 적용되어 있습니다. 오늘 내용 끝!