본문으로 바로가기

구글 애드센스에 자동광고 기능이 추가 되었다. 고정 된 곳에 광고를 표시하는 것은 HTML 소스로 간단했지만, 글 중간에 들어가는 경우 일일이 광고 코드를 입력해야 했다. 구글이 광고 페이지의 구조를 파악해서 적절한 갯수의 광고를 최적화 된 위치에 게재한다. 위치 선정과 갯수가 아직은 완성도가 부족해 보이지만, 업데이트를 거칠수록 좋은 효과를 가질 것으로 보인다.



자동 광고를 클릭하면 안내화면이 나온다. 그리고, 적용할 수 있는 광고의 종류가 나열된다. 모두 선택해 두었다. 차후 추가되는 기능들은 적용되게끔 설정했다.



티스토리 블로그에 적용해야 한다. 블로그 관리 페이지로 이동한다. 메뉴의 꾸미기> 스킨편집을 선택한다.



html 편집을 선택한다.



애드센스로 발급받은 자동광고 소스를 <head>와 </head> 사이에 추가한다. <head> 바로 아래에 추가하면 된다. 



웹페이지의 경우 일정 시간이 지나면 적용이 된다. 글의 길이에 따라 다양한 갯수의 광고가 게재된다. 하지만, 모바일의 경우 적용되지 않는다. 티스토리 모바일 페이지 html 를 적용할 수 있는 메뉴가 보이지 않는다. 모바일 페이지의 html 소스를 열어보아도 자동 광고 소스가 보이지 않는다. 플러그인 가운데, 구글 애드센스(모바일) 플러그인이 있다. 모바일을 따로 광고 설정을 했다. 하지만, 태블릿이나 다양한 사이즈의 화면에서 모바일 광고를 볼 경우, 고정 된 광고로만 보일 것이다. 


자동광고 소스를 추가해보자. 플러그인에서 광고의 사이즈를 확인하고 소스에 적용시켜 버린다. 자동광고가 들어가도 크기가 고정된다. 플러그인의 사이즈 체크를 피해가려고 넣었던 주석을 확인해서 소스에 반영해 버린다. 


플러그인에 입력한 자동광고 소스

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

<!-- tistory_플러그인_반응형 -->

<ins class="adsbygoogle"

     style="display:block"

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

     data-ad-slot="1626533988"

     data-ad-format="auto"></ins>

<script>

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

</script>




<!--  width:300px;height:250px -->


모바일 페이지에서 확인한 소스

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

<ins class="adsbygoogle" style="display:inline-block;width:300px;height:250px" data-ad-client="ca-pub-123456789" data-ad-slot="123456789" ></ins>

<script>(adsbygoogle = window.adsbygoogle || []).push({});</script>


해당 플러그인을 선택하고 광고 형태를 본문 위와 아래로 설정했다. 플러그인의 사이즈 체크를 우회하는 주석 코드를 추가해서 자동광고 소스를 두 곳에 입력하고 적용한다.



광고 위치와 크기가 고정되어 버린다. 반응형 플러그인을 통해 적용하면 웹과 모바일 모두 위치가 고정되어 버린다. 광고 사이즈는 고정이 되지 않는듯 한데, 웹에서도 자동광고 기능이 멈춰 버린다. 모니터링을 지켜본 후, 반응형으로 적용할지, 모바일을 별도로 설정할지 정해야겠다.


업데이트>

구글애드센스 반응형 플러그인에 자동광고 애드센스 코드를 넣으면, 웹페이지와 모바일에 모두 적용된다.