친효스킨 업데이트 주의할 점 - 순서 정리

친효스킨은 친절한효자손님의 블로그를 통해 알게 되었고 

지금까지도 잘 쓰고 있습니다. 

처음에 한번 쓰다보면 다른 것으로 변경하기도 힘들 정도로 

잘 만들어진 스킨입니다. 

 

친효스킨 업데이트는 이것만 따라해도 됨

 

업데이트도 체계적으로 이루어져 있어서 

친효스킨이 판올림되는 경우에 

기존 것을 업그레이드 해야 하는 시점이 생깁니다. 

이럴 때마다 해야 할 것들을 정리해 봅니다.

 

매번 업그레이드 할 때 고려해야 할 것에 대해

일목요연하게 체계적으로 정리된 자료를 참고하여

빠른 업데이트에 도움이 되었으면 합니다. 

 

     

    가장 먼저 해야 할일 - 기존 스킨 백업

    스킨 변경은 언제나 신중하게 해야 합니다. 

    가장 기본적인 것은 기존 스킨을 백업을 받아두는 것입니다. 

     

    스킨변경 메뉴에서 현재 이용중인 스킨을 보관

    스킨변경 메뉴에서 현재 이용중인 스킨을 보관하면 됩니다. 

    그리고 아래 글을 잘 읽어보면서 진행하면 다시 원래의 스킨으로 돌아갈 일 없을 테니 잘 따라와 주세요. 

     

    플러그인 활용

    기존 스킨을 사용하면서 별도로 설정 했던 것을 기억해 두었다가 설치 후에 다시 설정해야 합니다. 

    지금은 티스토리에서 플러그인을 통해 일부 백업 역할을 해줍니다. 

    왜냐면 스킨을 변경해도 플러그인은 그대로 동작하기 때문입니다. 

    아래의 플러그인을 확인해서 값들이 제대로 들어가 있는지 확인해봅니다. 

     

    구글서치콘솔/애널리틱스 플러그인

    구글 서치콘솔 플러그인을 통해 구글 계정에 로그인하는 것만으로 

    서치콘솔 등록과 사이트맵 제출을 자동으로 할 수 있습니다. 

    구글 애널리틱스는 추적 아이디를 넣으면 자세한 통계를 볼 수 있습니다. 

     

     

    메타태그 플러그인

    구글, 네이버, 빙 등 홈페이지 소유자 확인을 위한

    siteverification 을 html 에 직접 수정 편집하지 않아도 플러그인만으로 설정이 가능합니다. 

    그 전에는 html 편집을 통해 해야 해서 초보자들이 하기에 어려워 하는 경우가 많았습니다. 

    잘 못 수정해서 오류가 생기는 경우도 많았습니다. 

    아래와 같이 한번만 등록해두면 html 편집하지 않아도 됩니다. 

     

    플러그인으로 해결이 되지 않는 것들

    애드센스 승인 시 필요한 코드는 스크립트 형태이므로 이건 반드시 스킨 변경 이후에 수동으로 넣어줘야 합니다.

     

    기존 html 백업

    기존 html을 수정하는 경우는 거의 <html> 안쪽에 대부분 수정을 했을 겁니다. 

    수정된 내용만을 발췌하는 것보다는 전체 백업을 txt 파일로 받아두는 것이 좋습니다. 

    그런데 이마저도 친효스킨이 지속 업데이트되면서 사용자가 직접 수정할 일이 거의 없어졌습니다. 

     

    사이드바 주의

    스킨 변경시에 사이드바는 초기화가 됩니다. 

    따라서 사이드바에 포함한 목록의 종류와 순서 그리고 설정을 수정한 경우에는 사전에 미리 확인을 해두어야 합니다. 

    아래와 같이 스크린 샷을 찍어두면 그대로 설정하는데 도움이 됩니다. 

     

    html 배너출력 광고나 이미지 광고 같은 것들을 설정했다면

    설정 내용도 역시 백업을 받아두어야 합니다. 

    html 배너출력 광고의 경우 "사용자 모듈에 저장" 기능이 있으므로 

    활용해서 미리 백업을 해둡니다. 

     

     

    커버 기능 배치 

    커버기능도 스킨 적용 후에 반영을 해주어야 합니다. 

    미리 현재의 커버 상태를 스크린샷으로 기록을 해두고 스킨 적용 후에 그대로 반영하면 됩니다. 

     

    그리고 커버 부분도 체크해 둡니다. 

     

    인피드 광고 설정

    친효스킨에서 인피드 광고 설정하는 방법은 스킨 편집의 홈 화면에서 할 수 있습니다. 

    단순히 인피드 광고 slot 번호만 넣으면 자동으로 반영이 됩니다. 

    몇 개 간격으로 인피드 광고를 넣을지를 간단하게 조정이 가능하니 

    위의 스크린 샷을 참고하세요.

     

    친효스킨 업데이트 버전 다운로드

    이제 본격적으로 친효스킨 업데이트 파일을 다운로드합니다.

    스킨을 적용하는 방법에 대해 세부적인 내용은 아래의 수익형 티스토리 스킨 적용하는 방법을 참고하세요. 

     

    아래의 글은 고래스킨으로 적용하는 방법을 안내하고 있습니다.

    고래스킨도 친효스킨과 마찬가지로 개발자가 스스로 개발하여 배포하는 것으로

    다운로드 후 적용하는 방법은 동일합니다. 

     

     

    티스토리 수익형 스킨 추천 - 인피드 광고 적용 방법

    지난 포스팅에서 수익형 블로그로 적당한 블로그 플랫폼에 대해서 알아봤습니다. 네이버블로그와 티스토리, 그리고 워드프레스에 대해 살펴보았습니다. 그리고 블로그 주제는 무엇으로 해야

    finjoy.net

     

    티스토리 스킨 변경 후 해야 할 일

    이제 스킨이 변경되었다면 원래 설정과 동일하게 손봐주어야 할 부분이 있습니다. 

    아래 순서대로 하면 빠짐없이 체크할 수 있습니다. 

     

    스킨 기본 설정

    위에 백업을 잘 받아 두었고, 스크린 샷을 찍어 두었으니

    해당 내용을 보고 그대로 설정하면 됩니다. 

     

    사이드바 설정 

    이전 상태를 스크린 샷으로 찍어 두었으니

    사이드바에 넣을 것들의 종류와 순서, 그리고 설정값을 그대로 카피하여 설정하면 됩니다. 

    HTML 광고도 이전에 저장해둔 코드를 그대로 사용하면 됩니다. 

    아까 사용자 모듈로 적용해둔 것도 왼쪽에 있으니 그대로 + 버튼만 눌러서 

    오른쪽에 원하는 위치에 두면 됩니다. 

     

    애드센스 광고 설정

    광고단위는 아래와 같이 총 7개가 필요합니다. 

    사이드바 HTML 광고 <- 사용자 모듈로 저장해 두어 이미 적용

    인피드 광고, 

    최상단 광고, 최하단 광고

    본문상단 좌, 본문상단 우

    하단 일치하는 콘텐츠

     

    결국 위의 7개의 slot 번호만 넣으면 동작하도록 되어 있어 간편합니다. 

    인위적으로 코드를 html을 수정하며 반영할 필요가 없습니다. 

     

    TOC 설정 : Table of Contents

    글을 작성할 때 목차를 작성해야 할 경우가 있습니다. 

    반자동으로 H1~4 태그를 수집해서 일목요연하게 목차로 보여주는 것입니다. 

    길이 길 때 필요한 부분을 바로 찾아서 볼 수 있게도 해주지만

    더 중요한 건, 목차가 있을 때 SEO 관점에서도 도움이 됩니다. 

     

    TOC 설정은 조금 복잡한 부분이 있습니다만 

    이조차도 필요한 js 파일, html/css 수정이 이미 되어 있는 상태입니다.

     

    이용자는 아래 코드만 목차를 넣을 곳에 넣어주면 됩니다. 

    <!-- TOC 시작 -->
    <div id="rgyTOC">
    <ul id="toc">&nbsp;</ul>
    </div>
    <!-- TOC 끝 -->
    <p>&nbsp;</p>
    <!-- TOC 끝 -->
    <div id="toc-contents">
    
    <!-- 목차를 넣을 범위를 감싸줌 -->
      
    </div>

    위에서 목차를 넣을 범위를 감싸준다는 의미는

    목차를 뽑아내기 위한 h1~h5 가 포함된 곳들을 저 범위 안에 들어가도록 설정해야 한다는 것입니다. 

    html 모드로 상기 코드를 넣어도

    기본모드 상에서는 목차가 보이지 않고, 

    미리보기를 통해 봐야 목차가 정상적으로 보입니다. 

     

    함께 읽으면 좋은 글

    티스토리 수익형 스킨 추천 - 인피드 광고 적용 방법

    네이버블로그, 티스토리, 워드프레스 비교 선택

    댓글

    Designed by JB FACTORY