화면 폭당 정확한 광고 단위 크기의 예
애드센스 반응형스킨을 사용한다면, 광고코드도 반응형으로 사용해야합니다. PC에서는 아무런 제약이 없지만 모바일에서 가장 먼저 뜨는 상단광고창의 크기가 세로 100을 넘으면 규정위반이 되기때문입니다.
물론 엄청 방문자수 많은 블로그에서 상단의 200X200, 336X280, 300X250등의 보기좋은 광고창이 걸려있는것을 자주 봅니다. 하지만 규정은 규정이고 언젠가는 부메랑으로 돌아와서 계정해지가 될 수 있어서 주의해야합니다.
참고로 애드센스 계정해지가 되면, 그동안 쌓아놓은 수익을 전혀 손 못댄다고하니 겁납니다.
반응형광고코드를 입력하면 알아서 가로폭의 크기에 맞춰서 반응형광고가 삽입됩니다. 다만 가로로 길죽한 광고창이 뜨는 경우가 태반입니다.
애드센스에서는 공식적으로 반응형광고코드도 수정하여 입력할 수 있도록 해놨습니다. 아래는 애드센스에서 공지한 코드수정의 예중의 하나입니다. 가장 많이 사용되는 수정방법으로 알고있습니다.
애드센스 반응형광고코드 수정방법
3개 유형의 화면 폭(모바일, 태블릿, 데스크톱)에 맞춰 개별적으로 광고 단위 크기를 설정하도록 반응형 코드를 수정하는 방법입니다.
CSS 미디어 쿼리를 사용해 보지 않았거나 애드센스 광고 코드를 수정해 본 경험이 없어도 이 예를 이해할 수 있습니다.
애드센스 화면폭당 반응형광고코드 수정하는 방법 |
||||||||
다음은 화면 폭당 정확한 광고 단위를 설정하는 수정된 반응형 광고 코드의 예입니다.
화면 폭 500픽셀 이하: 320x100 광고 단위
화면 폭 500~799픽셀: 468x60 광고 단위
화면 폭 800픽셀 이상: 728x90 광고 단위
<style>
.example_responsive_1 { width: 320px; height: 100px; }
@media(min-width: 500px) { .example_responsive_1 { width: 468px; height: 60px; } }
@media(min-width: 800px) { .example_responsive_1 { width: 728px; height: 90px; } }
</style>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- example_responsive_1 -->
<ins class="adsbygoogle example_responsive_1"
style="display:inline-block"
data-ad-client="ca-pub-XXXXXXX11XXX9"
data-ad-slot="8XXXXX1"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
이 샘플 코드를 내 사이트에 맞춰 수정하는 방법은 다음과 같습니다. 위 붉은색 글자를 본인의 아이디와 이름으로 수정하면 됩니다.
애드센스 계정에서 반응형 광고 단위를 만들고 반응형 광고 코드에서 다음 정보를 따로 기록해 둡니다.
내 게시자 ID, 예: ca-pub-1234567891234567
내 광고 단위의 ID(data-ad-slot), 예: 1234567890
샘플 코드에서 다음과 같이 수정합니다.
모든 example_responsive_1 인스턴스를 고유한 이름(예: Home_Page, front_page_123)으로 바꿉니다. 그냥 본인의 영문이니셜에 1 2 3로 해놓는게 편하더군요.
고유한 이름은 영문자(A~Z), 숫자, 밑줄만으로 구성되어야 하며, 영문자로 시작해야 합니다.이 샘플 코드를 수정할 때마다 각기 다른 고유한 이름을 사용해야 합니다. 즉 여러가지 수정코드를 그때마다 원하는 곳에 삽입하여 수익추이를 분석할 수 있습니다.
사실 위와같은 코드를 입력해서 수익이 일취월장하는 분도 있겠지만, 기본적으로 많은 분이 방문하지않으면 수익은 요원합니다.
댓글