구글 애드센스 가입방법은 http://pcsak3.com/121 를 참조하십시오

 


 사이드바 

 

홈페이지 본문의 좌측 또는 우측에 메뉴, 카운터가 있는 것을 사이브바라고 합니다. 티스토리 사이드바에 구글애드센스를 넣는 방법을 알아보겠습니다.

 

 

 

 사이드바 플러그인 위치 확인
 

 

[관리자페이지] 에서 [스킨] => [HTML/CSS 편집]으로 들어갑니다. Skin.html 과 style.css 2개로 구분되어 있는데 skin.html 을 편집할 것입니다.

사이드 바의 시작부분을 찾기 위해서 Ctrl + F 를 눌러 "<!-- 기본 사이드바 -->" 또는 "<!-- 블로그 설명 모듈 -->"를 검색합니다. 레이아웃마다 이름이 조금씩 다를수 있으므로 주의하셔야 합니다.

 

 

 

 사이드바에 추가 

 

참고로 제 블로그는 "블로그 설명 모듈", "카테고리 모듈" 순서로 되어 있어서 skin.html 이 이런식으로 되어 있었습니다.

<!-- 기본 사이드바 -->

    <s_sidebar_element>

    <!-- RSS 링크 -->

        <div id="btnRSS"><a href="[##_rss_url_##]" onclick="window.open(this.href); return false" title="[##_title_##] 구독하기">RSS FEED</a></div>

    </s_sidebar_element>

    <s_sidebar_element>

    <!-- 블로그 설명 모듈 -->

        <div class="boxTopR"><div class="boxTop-left"></div><div class="boxTop-mid"></div><div class="boxTop-right"></div></div>

        <div class="boxMidR">

            <div id="blogImage"><img src="[##_image_##]" alt="블로그 이미지" /></div>

            <div id="userID">[##_blogger_##]</div>

            <div id="blogDesc">[##_desc_##]</div>

        </div>

        <div class="boxBtmR"><div class="boxBtm-left"></div><div class="boxBtm-mid"></div><div class="boxBtm-right"></div></div>

    </s_sidebar_element>

 

 

<!—여기에 구글 애드센스 코드를 넣으면 됩니다.

하지만 그냥 넣으면 모양이 없이 출력되서 보기에 좋지 않습니다. -->

 

    <s_sidebar_element>

    <!-- 카테고리 모듈 -->

        <div class="boxTopR"><div class="boxTop-left"></div><div class="boxTop-mid"></div><div class="boxTop-right"></div></div>

        <div class="boxMidR">

            <div id="category">

                <h3 class="stitle">카테고리</h3>

                [##_category_##]

            </div>

        </div>

        <div class="boxBtmR"><div class="boxBtm-left"></div><div class="boxBtm-mid"></div><div class="boxBtm-right"></div></div>

    </s_sidebar_element>

 

 

카테고리 모듈의 <s_sidebar_element> 부터 </s_sidebar_element> 까지 그대로 복사하여 div 부분만 교체해서 아래와 같이 하였습니다..

<!-- 기본 사이드바 -->

    <s_sidebar_element>

    <!-- RSS 링크 -->

        <div id="btnRSS"><a href="[##_rss_url_##]" onclick="window.open(this.href); return false" title="[##_title_##] 구독하기">RSS FEED</a></div>

    </s_sidebar_element>

    <s_sidebar_element>

    <!-- 블로그 설명 모듈 -->

        <div class="boxTopR"><div class="boxTop-left"></div><div class="boxTop-mid"></div><div class="boxTop-right"></div></div>

        <div class="boxMidR">

            <div id="blogImage"><img src="[##_image_##]" alt="블로그 이미지" /></div>

            <div id="userID">[##_blogger_##]</div>

            <div id="blogDesc">[##_desc_##]</div>

        </div>

        <div class="boxBtmR"><div class="boxBtm-left"></div><div class="boxBtm-mid"></div><div class="boxBtm-right"></div></div>

    </s_sidebar_element>

 

 

 

 

 

    <s_sidebar_element>

    <!-- 구글 애드센스-->

 

        <div class="boxTopR"><div class="boxTop-left"></div><div class="boxTop-mid"></div><div class="boxTop-right"></div></div>

    <div class="boxMidR">  

        <div id="google_left">

                                           <script type="text/javascript"><!--

                                          구글코드   
                                             </script>

                                            

</div>

</div>

        <div class="boxBtmR"><div class="boxBtm-left"></div><div class="boxBtm-mid"></div><div class="boxBtm-right"></div></div>

    </s_sidebar_element>

 

 

            

 

    <s_sidebar_element>

    <!-- 카테고리 모듈 -->

        <div class="boxTopR"><div class="boxTop-left"></div><div class="boxTop-mid"></div><div class="boxTop-right"></div></div>

        <div class="boxMidR">

            <div id="category">

                <h3 class="stitle">카테고리</h3>

                [##_category_##]

            </div>

        </div>

        <div class="boxBtmR"><div class="boxBtm-left"></div><div class="boxBtm-mid"></div><div class="boxBtm-right"></div></div>

    </s_sidebar_element>

 

 

 

 

 사이드바 설정
 

혹시 저렇게 임의로 코드를 추가하면 사이드바 설정에 문제가 생기지 않을까 걱정되서 [사이드바 설정]을 확인해 봤습니다. 괜한 걱정을 했나 봅니다. 문제가 생기기는커녕 새로운 모듈형태로 추가되어 있었습니다.

 

 

뿐만 아니라 [구글 애드센스] 모듈을 사이드바에서 제거하면 [사용가능한 모듈]로 이동되었습니다.

 

구글 애드센스 뿐만 아니라 다른 모듈도 이런 형태로 만들어서 추가/제거 하면 관리하기가 편해집니다.

  1. 2011.02.18 16:47

    <s_sidebar_element> <!-- 카테고리 모듈 -->
    바로 여기 위에다가 애드센스 코드만 붙여넣으면 되는줄 알았는데, 다시 찾아보니
    애드센스 코드 위아래에다가도 똑같이 이걸
    <s_sidebar_element>
    </s_sidebar_element>
    붙여넣어야 되는군요.. 저 같은 초보들은 헤맬듯 ;;;

    • Favicon of https://pcsak3.com BlogIcon WhiteAT 2011.02.18 21:21 신고

      지금은 이 방법을 사용하실 필요가 없습니다 ;;

      2011년 1월 11일에 티스토리에서 사용자 모듈기능을 제공하여 관리하기가 쉬워졌습니다.

      아래 주소 참고하세요.~~

      http://notice.tistory.com/1601 에

+ Recent posts