본문 바로가기
잡동사니/블로그

블로그 스킨변경 - 티스토리 반응형 웹스킨 Fastboot 1.6.1 적용

by 마쑤 2014. 5. 11.
반응형

그동안 블로그 스킨변경을 준비해오다 모처럼 여유로운(?) 주말을 맞아 인기있는 반응형 웹스킨 Fastboot 의 최신버전 1.6.1으로 블로그 스킨을 변경했습니다 반응형다운 애드센스를 적용하는것이 조금 어려웠지만 Fastboot스킨의 제작자이신 리드이지님(Readiz)의 애드센스 삽입 지침을 보고 응용하여 (사실은 리드이지님의 블로그의 광고배치를 몽땅 카피한..)하나씩 적용했더니 이상없이 잘 동작하네요 

스킨 교체 작업을 나열하자면 아래의 순서로 진행했습니다

  1. 사용중인 스킨의 HTML 수정에서 새 스킨에도 사용할 주요기능(자바스크립트)을 다운로드한 스킨의 skin.html파일을 열어서 미리 수정 혹은 추가, 블로그에 사용될 이미지파일들을 미리 제작(블로그 상단 이미지,이메일주소 이미지등등)
  2. 반응형 웹스킨에 사용할 애드센스 광고단위들을 적합한 사이즈별로 광고코드 생성 및 맞춤채널 변경
  3. 테스트 블로그에서 적용전 마지막 테스트
  4. 자신의 블로그에 스킨 업로드(점검등으로 최종 수정을 마친 파일들)

- 기존에 사용하던 웹표준 준수 스킨 Orchid 스킨의 장점은 배경이 어두워서 본문에 집중이 잘된다고 판단하였고 또한 스킨위저드등의 티스토리의 스킨관련 기능을 모두 지원하여 원하는대로 변경이 자유로운점입니다 

- 반응형 스킨으로 교체하면서 스샷에 보이는 플로팅배너는 이제 안녕입니다 애드센스 이외의 다른 광고매체의 것은 전부 삭제

- Fastboot 1.6.1 으로 변경한후의 메인페이지

- 애드센스 광고 수와 배치는 리드이지님의 블로그를 참조하여 그대로 배치하였습니다 글도입부에 텍스트가 적고 바로 이미지가 있는 경우 위 스샷과 같이 좀 뻘쭘해보이는 부작용이 있네요

- 글 도입부에 텍스트가 적당하고 이미지 시작위치도 적당할경우 보기에 훨씬 좋습니다 

스킨을 자주 변경하지 않는지라 이번에도 여러 좋은 스킨들중에서 고민 많이 했지만 Fastboot 스킨으로 결정한 가장 큰 이유는 곳곳에 주석이 잘되어 있어서 수정을 하기 가장 편해서입니다 그동안 리드이즈님 블로그에서 미리 공부해두고 며칠전부터는 테스트 블로그에서 많은 테스트를 하고 변경했는데도 실제 적용할땐 안되는 부분이 하나는 걸리더군요

다음뷰 추천박스가 카테고리 다른글보기 앞에 나오게 하려고 삽질하다가 리드이지님의 조언대로 플러그인에서 다음뷰와 카테고리 다른글 보기를 설정해지후 다음뷰 , 카테고리 다른글보기의 순서로 다시 설정하니 원하는대로 되는군요


 관련글 바로가기

반응형 스킨 5종 비교 : http://massukr.tistory.com/181

리드이지님 Fastboot 블로그 : http://blog.readiz.com/


댓글