JB SKIN 167 스킨 사이드바에 애드센스 넣는 법
- 직장빼고생활/블로그
- 2020. 12. 29.
1. 개요
최근 JB 167 스킨을 최근에 구매했는데요, 사이드바에 애드센스를 넣는 기능이 없더라구요. HTML을 조금 아시는 분께는 사이드바에 애드센스를 넣는 게 크게 어려운 일은 아닐텐데, 혹시나 몰라서 곤란한 분이 계실까봐 간단한 가이드를 적고자 합니다. 공식 매뉴얼에는 해당 내용이 없습니다.
2. 순서
(1) 애드센스에서 광고를 만들고, 태그를 복사합니다
디스플레이 광고를 선택하고 반응형이 선택되어있는지 확인 후 링크를 만드세요
아래와 같은 코드를 만들어놓습니다
(2) 스킨 편집에서 사이드바에 구글 애드센스를 추가합니다
티스토리 스킨 편집 메뉴에서 'html 편집'에 들어가서, 아래와 같은 부분('<!-- 관리자 메뉴 -->')을 찾습니다. 거기 바로 밑에다가 애드센스를 집어 넣을 것입니다.
부가 설명
사이드바의 요소는 <s_sidebar_element> ~ </s_sidebar_element> 에 들어갑니다.
따라서 저 두 태그 안에다가 애드센스 태그를 넣고, 관리자 메뉴 밑에다가 새로운 메뉴를 만들 것입니다.
위에 표시한 부분에다가 아까 복사한 태그를 <s_sidebar_element> 와 </s_sidebar_element> 사이에 넣어서 위의 표시한 부분에 넣습니다. 아래 예시와 같이 반드시 <s_sidebar_element> 옆에다가 <!-- 사이드바 애드센스 --> 라고 적어주세요. 다른 이름으로 해도 상관없으나, 일단 적어야지 사이드바 메뉴에서 설정이 가능합니다.
태그 예시
아래와 같은 태그를 위에 표시한 부분에 붙여넣기 합니다
<s_sidebar_element><!-- 사이드바 애드센스-->
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 사이드바 -->
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-552135054653120"
data-ad-slot="978113513351"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</s_sidebar_element>
태그를 넣으면 아래와 같이 됩니다.
꼭 저장하세요
3. 티스토리 사이드바 메뉴에서 애드센스가 나타나도록 설정합니다
티스토리 설정 - 꾸미기 - 사이드바에 들어가면 아래 표시한 것과 같이, 사이드바 애드센스 메뉴가 나타난 것을 확인할 수 있습니다. 왼쪽의 기본 모듈에 있으면, 아래와 같이 오른쪽으로 옮겨서 위치를 정합니다. 그리고 저장하면 이제 사이드바에서 광고가 뜨는 것을 확인할 수 있습니다.
(참고) 위에서 <!-- 사이드바 애드센스--> 라고 설정한 이름이 여기 메뉴에서 뜨는 것이므로, 자신에게 맞는 이름으로 임의로 바꾸어 사용하시면 됩니다.
완성화면
감사합니다. 문의사항 있으시면 댓글주세요.