애드센스광고배치 어렵지 않아요~
오늘은 본문포스팅에서 상단오른쪽에 애드센스광고 1개를배치하는 방법에 대해서
포스팅해보도록 하겠습니다.
이 방법은 반응형스킨을 사용하는 블로그에만 사용가능한 방법이며,
데스크탑과 모바일에서 동일하게 오른쪽상단에 배치가 되어 보여집니다.
저도 반응형스킨을 사용하고있지만, 구글 애드센스의 반응형광고를 데스크탑상에서
보여질때 오른쪽상단에 위치시키는것은 그리 어렵지 않았으나,
모바일에서도 똑같이 적용시키기가 어려워 상당히 고전했던 적이 있었습니다.
하지만 오늘 제가 알려드릴 이 스크립트를 사용하면 모바일이든 데스크탑이든'
동일하게 적용이되어 보여집니다.
데스크탑상에서 336*280 광고를 보여지게 할건데 모바일에서는 이 크기로 적용되면
모바일화면에서는 본문글이 보이지않게되어, 구글애드센스정책위반사항이 됨으로, 모바일화면에서는 자동으로 광고의크기가 줄어들게 할 것입니다.
블로그 오른쪽광고배치 스크립트태그
아래 스크립트가 오늘 적용할 스크립트입니다.
제 블로그에서 복사가 금지되어있어 복사할 수가 없으니 하단에 해당소스를 파일첨부해놨으니 다운받으시면 됩니다.
<style>
.abc { width: 336px; height: 280px;}
@media(max-width: 499px) { .abc { width: 200px; height: 200px; } }
@media(min-width: 500px) { .abc { width: 250px; height: 250px; } }
@media(min-width: 800px) { .abc { width: 336px; height: 280px; } }
</style>
<div style="float: right; margin: 0px 0px 10px 20px;">
<!-- abc -->
<ins class="adsbygoogle abc"
style="display:inline-block"
data-ad-client="본인구글광고 client 코드를 붙여넣으세요"
data-ad-slot="본인구글광고 slot 코드를 붙여넣으세요"></ins>
</div>
파일첨부-클릭 후 다운.txt다운받은 소스에서, 본인구글광고 client 코드를 붙여넣고 본인구글광고 slot 코드를 붙여넣으세요. 위 설명이 입력된곳만 본인의 구글광고 코드로
수정해주시면 됩니다.
그리고 .abc로 표시된 부분은 광고의 이름칸이라 임시로 abc로 입력했으니, 본인이 원하시는 이름으로 바꾸셔도 됩니다. 안바꾸셔도 상관없습니다.
수정한 뒤 HTML편집에서
애드센스광고배치 어렵지 않아요~
오늘은 본문포스팅에서 상단오른쪽에 애드센스광고 1개를배치하는 방법에 대해서
포스팅해보도록 하겠습니다.
이 방법은 반응형스킨을 사용하는 블로그에만 사용가능한 방법이며,
데스크탑과 모바일에서 동일하게 오른쪽상단에 배치가 되어 보여집니다.
저도 반응형스킨을 사용하고있지만, 구글 애드센스의 반응형광고를 데스크탑상에서
보여질때 오른쪽상단에 위치시키는것은 그리 어렵지 않았으나,
모바일에서도 똑같이 적용시키기가 어려워 상당히 고전했던 적이 있었습니다.
하지만 오늘 제가 알려드릴 이 스크립트를 사용하면 모바일이든 데스크탑이든'
동일하게 적용이되어 보여집니다.
데스크탑상에서 336*280 광고를 보여지게 할건데 모바일에서는 이 크기로 적용되면
모바일화면에서는 본문글이 보이지않게되어, 구글애드센스정책위반사항이 됨으로, 모바일화면에서는 자동으로 광고의크기가 줄어들게 할 것입니다.
블로그 오른쪽광고배치 스크립트태그
아래 스크립트가 오늘 적용할 스크립트입니다.
제 블로그에서 복사가 금지되어있어 복사할 수가 없으니 하단에 해당소스를 파일첨부해놨으니 다운받으시면 됩니다.
<style>
.abc { width: 336px; height: 280px;}
@media(max-width: 499px) { .abc { width: 200px; height: 200px; } }
@media(min-width: 500px) { .abc { width: 250px; height: 250px; } }
@media(min-width: 800px) { .abc { width: 336px; height: 280px; } }
</style>
<div style="float: right; margin: 0px 0px 10px 20px;">
<!-- abc -->
<ins class="adsbygoogle abc"
style="display:inline-block"
data-ad-client="본인구글광고 client 코드를 붙여넣으세요"
data-ad-slot="본인구글광고 slot 코드를 붙여넣으세요"></ins>
</div>
다운받은 소스에서, 본인구글광고 client 코드를 붙여넣고 본인구글광고 slot 코드를 붙여넣으세요. 위 설명이 입력된곳만 본인의 구글광고 코드로
수정해주시면 됩니다.
그리고 .abc로 표시된 부분은 광고의 이름칸이라 임시로 abc로 입력했으니, 본인이 원하시는 이름으로 바꾸셔도 됩니다. 안바꾸셔도 상관없습니다.
수정한 뒤 HTML편집에서 바로위에 붙여넣기 하세요.
그리고 이걸로 끝이지만, 한가지 더 하셔야 할 작업이 있습니다. 마찬가지로 HTML편집에서 맨끝에
-본인구글광고스크립트삽입-
</s_t3></body>
에서 </s_t3></body>바로 위에 본인의 애드센스광고스크립트(반응형광고)를 붙여넣으시는데, 위에서 입력한 본인의 구글광고 slot 코드와 동일한
애드센스 광고를 붙여넣으시면 됩니다.
이 작업을 하는 이유는 본인의 애드센스광고스크립트를 아래로 빼놓지않으면, 인터넷익스플로러 8에서 에러가 나기 때문입니다.
자! 이제 확인을 해보도록 할까요?
PC화면으로 봤을때 오른쪽상단에 광고가 배치되었습니다.
모바일화면에서도 오른쪽에 광고가 생성된게 보이시죠? 혹시나 모바일 화면에서의 광고크기를 조절하시려면 아래빨간부분을 변경해주시면 됩니다.
<style>
.abc { width: 336px; height: 280px;}
@media(max-width: 499px) { .abc { width: 200px; height: 200px; } }
@media(min-width: 500px) { .abc { width: 250px; height: 250px; } }
@media(min-width: 800px) { .abc { width: 336px; height: 280px; } }
</style>
<div style="float: right; margin: 0px 0px 10px 20px;">
<!-- abc -->
<ins class="adsbygoogle abc"
style="display:inline-block"
data-ad-client="본인구글광고 client 코드를 붙여넣으세요"
data-ad-slot="본인구글광고 slot 코드를 붙여넣으세요"></ins>
</div>
크기를 200*200 으로 변경했을때의 모바일화면입니다.
크기를 250*250 으로 변경했을때의 모바일화면입니다.
제가 사용하고있는 핸드폰은 갤럭시4 입니다. 수익면으로봤을때는 애드센스정책을 위반하지않고 250*250 으로 변경했을때가 클릭율이 제일 높을것으로
예상이됩니다만, 저는 미관상 200*200이 제일 보기가 좋아 그렇게 설정을 했습니다. 여러분도 200*200 으로 하시는게 좋을겁니다.
왜냐하면, 250*250 으로 변경했을때 화면이 작은 아이폰에서는 본문글이 보이지않고 화면을 다 가릴 수 있기때문에,
애드센스정책위반으로 구글계정이 정지가 될 수 있습니다. 흐아..이렇게 쉽게 공개해도 되나 모르겠네요. ㅎㅎ
▶ 관련포스팅 : 블로그에 애드센스광고달기(광고생성 및 블로그에적용하기)
▶ 관련포스팅 : 티스토리 글목록 사진으로 변경하기(썸네일 변경이라고 하죠)
▶ 관련포스팅 : 키워드추출 분석프로그램을 사용하여 순식간에 "돈버는 블로그" 만드는 방법!
▶ 관련포스팅 : 블로그로 돈을 벌려면 먼저 SEO최적화 방법을 배워라!
그리고 이걸로 끝이지만, 한가지 더 하셔야 할 작업이 있습니다. 마찬가지로 HTML편집에서 맨끝에
-본인구글광고스크립트삽입-
</s_t3></body>
에서 </s_t3></body>바로 위에 본인의 애드센스광고스크립트(반응형광고)를 붙여넣으시는데, 위에서 입력한 본인의 구글광고 slot 코드와 동일한
애드센스 광고를 붙여넣으시면 됩니다.
이 작업을 하는 이유는 본인의 애드센스광고스크립트를 아래로 빼놓지않으면, 인터넷익스플로러 8에서 에러가 나기 때문입니다.
자! 이제 확인을 해보도록 할까요?
PC화면으로 봤을때 오른쪽상단에 광고가 배치되었습니다.
모바일화면에서도 오른쪽에 광고가 생성된게 보이시죠? 혹시나 모바일 화면에서의 광고크기를 조절하시려면 아래빨간부분을 변경해주시면 됩니다.
<style>
.abc { width: 336px; height: 280px;}
@media(max-width: 499px) { .abc { width: 200px; height: 200px; } }
@media(min-width: 500px) { .abc { width: 250px; height: 250px; } }
@media(min-width: 800px) { .abc { width: 336px; height: 280px; } }
</style>
<div style="float: right; margin: 0px 0px 10px 20px;">
<!-- abc -->
<ins class="adsbygoogle abc"
style="display:inline-block"
data-ad-client="본인구글광고 client 코드를 붙여넣으세요"
data-ad-slot="본인구글광고 slot 코드를 붙여넣으세요"></ins>
</div>
크기를 200*200 으로 변경했을때의 모바일화면입니다.
크기를 250*250 으로 변경했을때의 모바일화면입니다.
제가 사용하고있는 핸드폰은 갤럭시4 입니다. 수익면으로봤을때는 애드센스정책을 위반하지않고 250*250 으로 변경했을때가 클릭율이 제일 높을것으로
예상이됩니다만, 저는 미관상 200*200이 제일 보기가 좋아 그렇게 설정을 했습니다. 여러분도 200*200 으로 하시는게 좋을겁니다.
왜냐하면, 250*250 으로 변경했을때 화면이 작은 아이폰에서는 본문글이 보이지않고 화면을 다 가릴 수 있기때문에,
애드센스정책위반으로 구글계정이 정지가 될 수 있습니다. 흐아..이렇게 쉽게 공개해도 되나 모르겠네요. ㅎㅎ
▶ 관련포스팅 : 블로그에 애드센스광고달기(광고생성 및 블로그에적용하기)
▶ 관련포스팅 : 티스토리 글목록 사진으로 변경하기(썸네일 변경이라고 하죠)
▶ 관련포스팅 : 키워드추출 분석프로그램을 사용하여 순식간에 "돈버는 블로그" 만드는 방법!
▶ 관련포스팅 : 블로그로 돈을 벌려면 먼저 SEO최적화 방법을 배워라!
