본문 바로가기

IT

티스토리 블로그 포스트 위 (또는 아래) 부분 광고 삽입 방법

HTML/CSS의 skin.html에서 블로그 포스트 구간을 나타내는 치환자는 [##_article_rep_desc_##]이다.
※ Ctrl+F를 눌러 찾기(Find) 기능을 사용하면 위치를 쉽게 찾을 수 있다.


이 치환자 위/아래에 광고 소스를 삽입하면 블로그 포스트의 위/아래에 광고를 위치시킬 수 있다.


이 블로그 포스트의 하단을 살펴 보면 네모난 광고 두 개가 나란히 있는 것을 확인할 수 있다. 사람들마다 사용하는 여러가지 방법이 있겠지만, 나의 경우는 table을 이용하여 구성하였다. 내가 사용하는 예제 소스를 아래 첨부한다.


<center><TABLE><TR><TD width="50%"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 광고1 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-4483302042288599"
     data-ad-slot="8022605664"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</TD><TD width="50%">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- 광고2 -->
<ins class="adsbygoogle"
     style="display:inline-block;width:300px;height:250px"
     data-ad-client="ca-pub-4483302042288599"
     data-ad-slot="3452805262"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</TD></TR></TABLE></center>


굵게 표시한 글씨가 투명한 색으로 □□의 형태를 잡아 놓은 것이고, 그 사이에 들어가는 것이 □□ 틀의 내부를 차지하고 있는 광고의 스크립트이다. 구글 애드센스를 사용하는 사람은 바로 복사/붙여넣기를 통해 사용할 수 있다.