티스토리 고래스킨 상단광고 2개 띄우는 방법 이 글만 보세요.

티스토리를 하다 보면 광고 배치에 신경을 많이 쓰게 됩니다. 특히 상단쪽 광고에 신경을 많이 쓰게 되는데요, 상단광고 갯수도 중요하고 위치도 중요하죠. 저는 고래스킨을 쓰면서 이것저것 많이 변형해서 쓰고 있는데 그 중 하나가 상단광고 2개 넣는 것입니다. 티스토리 고래스킨 상단광고 2개 띄우는 방법을 알아볼게요. 조금 더 꾸미고 싶다면 글씨체도 바꿔보세요.

 

고래스킨 글씨체 바꾸는 방법

 

티스토리 고래스킨 상단광고 2개 넣는 방법

티스토리 상단 광고를 넣어야 하는 이유

 

티스토리는 수익형으로 운영하는 분들이 많은데 상단 광고를 넣어야 하는 이유는 가장 많이 노출되고 가장 많은 CPC를 보여주는 곳이기 때문이에요. 따라서 상단에 광고를 어떻게 배치할지가 중요한데, 1개를 넣을 수도 있고 같은 줄을 2칸으로 나눠서 광고를 넣을수도 있습니다. 광고 넣는 방법은 아래에서 알아볼거에요.

 

상단 광고는 깔끔하게 1개만 넣는 분들도 있는데, 저는 한 줄에 2개를 넣습니다. 각자의 방법대로 넣으면 되는거니 이점은 참고만 해주세요.

 

고래스킨 상단 광고 넣는 방법

티스토리는 각 스킨마다 HTML코드가 달라서 스킨별로 넣는 방법이 다릅니다. 저는 티스토리 유저들에게 가장 유명한 고래스킨을 사용하고 있기 때문에 고래스킨에서 상단 광고 2개 넣는 방법을 소캐시켜드릴거에요. 순서는 애드센스 광고 만들기 >> 광고 코드 따기 >> HTML추가하기 입니다. 설명이 길어지는데 직접 해보면 5분도 안 걸리니까 해보셔요.

 

애드센스 광고 만들기 작업

 

1. 애드센스 광고 코드 2개를 만들어야 합니다. 우선 구글애드센스 사이트에 들어가서 광고탭에 광고 단위 기준을 눌러줍니다. 

 

 

2. 그 다음 디스플레이 광고 클릭, 광고를 만들기를 시작합니다. 광고 크기는 사격형, 반응형으로 합니다. 형식은 사각형으로 광고단위이름은 꼭 지정해주세요. 광고 단위 이름을 지정해놔야 나중에 이 광고의 효과가 얼마나 있는지 분석할 수 있습니다. 

 

 

 

이렇게 총 2개의 디스플레이 광고를 만들어줘야 합니다. 2개입니다. 잊지 마세요 2개입니다.

 

3. 광고를 만들면 광고마다 코드가 있잖습니까? 이 코드에서 우리가 불러와야 할 것이 있습니다. 코드를 보면 빨간색 네모박스 안에 숫자들이 있는데 이 숫자를 모두 복사해서 다른 곳에 보관해둡니다. 메모장 같은데 붙여넣기 해서 적어두세요.

 

 

새로 만든 광고 2개의 숫자를 모두 적어놔야 합니다. 알겠죠? 새로 만든 2개 광고 모두에요. 그럼 이제 HTML만들기 작업으로 넘어가볼까요?

 

HTML만들기 작업

 

자, 제가 아래에 HTML코드를 적어둘건데 이걸 복사해서 메모장에 넣어두세요. 요 녀석을 복사한 뒤에 우리가 아까 보관해둔 광고2개의 숫자를 넣을것입니다.

 

1. HTML코드 작성하기

<!-- 고래스킨 상단 광고 2개 HTML -->
<div style="text-align: center; margin-bottom: 15px;">
<style>
.adsbygoogle.post-top-first {display:block}
.adsbygoogle.post-top-second {display:none}
 
@media (min-width: 768px) {
.adsbygoogle.post-top-first {display:inline-block;min-width:336px;max-width:336px;width:100%;height:280px;}
.adsbygoogle.post-top-second {display:inline-block;margin-left:20px;min-width:336px;max-width:336px;width:100%;height:280px;}
}
</style>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle post-top-first"
     data-ad-client="ca-pub-1번광고단위 숫자"
     data-ad-slot="1번 광고단위숫자"
     data-ad-format="rectangle"
     data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<ins class="adsbygoogle post-top-second"
     data-ad-client="ca-pub-2번광고단위숫자"
     data-ad-slot="2번광고단위숫자"
     data-ad-format="rectangle"
     data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<!-- 고래스킨 상단 광고 2개 HTML 끝 -->

 

위의 코드를 잘 보면 제가 1번 광고단위숫자 2개와 2번 광고단위숫자 2개를 친절하게 글씨로 넣어놨죠? 저곳에 아까 우리가 만든 애드센스 광고 숫자 코드를 넣어주면 됩니다. 

 

 

넣는 자리 못 찾으실까봐 제가 또 친절하게 빨간색 박스로 표시해놨습니다.

 

2. 티스토리에 HTML추가하기

 

그 다음 티스토리의 관리 - 스킨편집에 가셔서 html편집을 누릅니다. html편집의 HTML란에 가서 우리가 위에서 만든 최종 코드를 넣을거에요.

 

 

 

html편집 화면에서 컨트롤 + F를 누른 다음 article_rep_desc를 검색하세요. 검색한 뒤 article_rep_desc 위에다가 우리가 만든 코드를 넣으시면 됩니다.

 

 

 

 

그러면 아래와 같이 상단 광고 2개가 쨔쟌! 하고 나타납니다. 고래스킨에서 상단 광고 세팅하는 방법 아주 쉽죠!?

 

상단광고 2개

 

여러분에게 도움이 되셨으면 좋겠네요. 이상으로 끝!