티스토리 블로그 인피드 광고 목록에서 보기좋게 나오게 하는 방법


광고를 붙여 넣었더니 목록 위아래로 하나씩 광고나와서 곤란할 때는 이렇게!


티스토리 인피드 광고 설치방법






 

구글 애드센스의 자동 네이티브 인피드 광고.

목록형 타입의 스킨을 사용하고 있는 티스토리 블로거라면 사용할만 합니다.

그런데 생성한 코드를 티스토리의 어디에 삽입을 하면 좋을지, 나름 삽입을 해봤는데 광고가 목록 위 아래로 하나씩 계속 나와서 곤란을 겪으신 분들은 아래 방법을 참고하여 수정하시면 됩니다.

해당 기사는 그린라이프님의 기사를 참고하고 있습니다.


티스토리의 티에디션을 사용하시거나 기존의 구스킨을 그대로 이용중이시라면 인피드 광고는 사용하실 수 없습니다.

인피드 광고 코드 생성방법은 아래 기사를 참고해주세요.


티스토리 블로그를 위한 인피드 광고단위 만들기





티스토리 블로그에 인피드 광고 삽입하는 방법

블로그에 삽입할 코드 스니펫을 구글 애드센스 페이지에서 복사해옵니다.

코드를 좀 수정해야 하므로 복사한 스니펫은 메모장 등에 붙여넣기 해두세요.

자, 이제 티스토리 관리자 모드에서 꾸미기→스킨편집 html편집을 열어줍니다.

티스토리 인피드 광고 설치방법



티스토리 인피드 광고 설치방법

Ctrl+F(검색)키를 활용해서 <s_index_article_rep>를 입력해서 찾아주세요.


여기부터가 중요한데 실제 우리가 적용할 인피드 광고의 코드는 <ins></ins>의 내용을 발췌해서 첨가할 코드 안에 넣어줘야 합니다.

일일이 손으로 치자면 머리 아플테니 해당부분만 수정하면 되도록 아래 자료를 첨부합니다. 


Adsense-infeed.txt




티스토리 인피드 광고 설치방법


원래라면,

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<ins class="adsbygoogle"

     style="display:block"

     data-ad-format="fluid"

     data-ad-layout-key="-dx+s+3t-pw+w7"

     data-ad-client="ca-pub-xxxxxxxxxxxxxxxx"

     data-ad-slot="xxxxxxxxxx"></ins>

<script>

     (adsbygoogle = window.adsbygoogle || []).push({});

</script>

▲위처럼 되어 있는 코드인데 <ins></ins>영역만 따로 잘라내서 엔터로 줄바꿈 되어 있던 곳을 일렬로 배치합니다.

엔터로 줄바꿈 하지 말고 스페이스로 띄어쓰기하며 일렬로 정리해주세요.


일단 아래처럼 코드를 수정해주세요.

<script>

InfeedCount ++;

  if ( InfeedCount % 3 == 0 ) {

       document.write('<ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-dy+i+67-ox+lf" data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" data-ad-slot="xxxxxxxxxx"></ins>');

(adsbygoogle = window.adsbygoogle || []).push({});

}

</script>

ca-pub-"xxxxxxxxxxxxxxxx" data-ad-slot="xxxxxxxxxx" 이 부분은 생성했던 인피드 광고내의 본인의 애드센스 코드로 대체하시면 됩니다.

이렇게 수정한 코드를 <s_index_article_rep>아래에 삽입합니다.


그리고

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<script>

var InfeedCount = 0;

</script>

이 코드를 </head> 위에 삽입합니다.


티스토리 인피드 광고 설치방법

▲이런 식으로 삽입하면 됩니다.


자, 이제 다 됐습니다. 스킨편집 창에서 저장과 새로고침을 누르고 자신의 홈화면을 확인해봅시다!


 




 

 

티스토리 인피드 광고 설치방법

이런식으로 목록 3개가 끝나면 광고가 하나 나오는 식으로 노출이 되고 있을겁니다.

노출빈도를 목록 4개나 5개 후에 광고가 나오게끔 하려면,


 if ( InfeedCount % 3 == 0 ) ←3이라고 되어 있는 숫자를 바꾸면 됩니다.



다들 문제없이 설치되셨길 바랍니다^^ 






 



Comment7