블로그 글 상단,하단에 애드센스 컨텐츠 광고 박스 넣기

Review/Useful Information

블로그 글 상단,하단에 애드센스 컨텐츠 광고 박스 넣기

오늘은어때 2012. 3. 25. 23:03

구글 애드센스를 처음 적용한건 몇년 전인데..
글 이미지에 광고가 끼어드는 걸 원치 않아서 항상 사이드바 정도에만 적용을 해두었습니다.

그러다가, 이번에 티스토리로 옮기면서
한번 가운데 컨텐츠박스도 넣어봐?? 하는 맘이 생겨서 ㅎ

작업하는데, 가운데에 이쁘게 넣으려니 조금 손이 가더라구요 ㅎ
그냥 테이블로 짜서 하는건 코드가 지저분하게 느껴져서; ㅋ

아래와 같이 수정했습니다.
혹시 필요한 분이 있을지 몰라, 올려놓습니다.
-사실... 스킨 이것저것 적용해 본다고 뻘짓하다 소스를 몇번 날려서....제가 필요했어요. ㅠ.,ㅠ

적용예시는 제 블로그를 보시면 아실꺼예요.
(글 상단에 애드센스 작은 박스 두개 붙였어요)

1. 우선 애드센스 소스 복사해오세요.
2. 티스토리 관리자모드 > 꾸미기 > HTML/CSS편집
3. skin.html 소스 중

<div class="desc">##_article_rep_desc_##</div>

요녀석 찾으신 뒤에 ##_article_rep_desc_## 이놈 앞에다 아래 소스 붙이시면 됩니당.
(하단에 넣고자 하시면 뒤에다 넣어주세요)

원래는 ##_article_rep_desc_## 이것 앞뒤로 [] 이렇게 붙어있어요.
티스토리 자체필터링으로 함께 적으면 view 페이지에서 사라져서;; 생략하고 적었으니
소스는 [] 이 표식 앞뒤로 붙여주셔야합니다.

<<요기에 구글 소스1 붙이세욘>>

</div>

<<요기에 구글 소스2 붙이세욘>>

</div>
</div>


4. style.css 소스에 아래 소스 붙이세요.

/* 애드센스 박스 CSS */

.addBox {10 10 10 10;overflow:hidden;width:원하는가로사이즈;vertical-align:middle;text-align:center;}

.addBox .contentboxlf {float:left}

.addBox .contentboxrt {padding-left:10px;float:left}

5. 본인 블로그 확인 ^^

아래는 예시입니다. 제것 ㅎ

google_ad_client = "ca-pub-9081747548086465";

/* 300250 중간직사각형1 */

google_ad_slot = "9016697480";

google_ad_width = 300;

google_ad_height = 250;

//-->

</script>

src="http://pagead2.googlesyndication.com/pagead/show_ads.js">

</script>

</div>

google_ad_client = "ca-pub-9081747548086465";

/* 300250 중간 직사각형 2 */

google_ad_slot = "4786071150";

google_ad_width = 300;

google_ad_height = 250;

//-->

</script>

src="http://pagead2.googlesyndication.com/pagead/show_ads.js">

</script>

</div>
</div>

/* 애드센스 박스 CSS */

.addBox {10 10 10 10;overflow:hidden;width:/*@post-width=*/650px/*@*/;vertical-align:middle;text-align:center;}

.addBox .contentboxlf {float:left}

.addBox .contentboxrt {padding-left:10px;float:left}

참고로 이건 티스토리용이구요.

.
.
이글루스 적용은 조금 다릅니다.
이글루스에서 티스토리처럼 본문 html에 적용하시면..자체적으로 먹어버립니다. -,.- 사라져요.
그래서 위젯 설정으로 가셔야하는데요.

우선 스킨 자체가 와이드위젯 적용이 가능한 것으로 설정이 되어 있어야하구요.
이글루스 스킨편집 도움말 - 새스킨만들기 레이아웃 << 요기 보시면 중간부분에 2) 포스트 상단 광고 영역

이라는 부분이 있어요. 이부분 보시면 레이아웃은 어느정도 이해가 가실겁니다 ^^

구글 애드센스 내 이글루에 붙이기 이 글을 보시면 구글애드센스 붙이는 설명이 되어있습니다만,
지금 적고자 하는 컨텐츠부분 위젯설명은 제대로 나와있지 않더라구요 ㅠ,ㅠ
(하단에 글로 설명되어있어서.. 못봤어요 ㅜ.ㅜ)
그래서 조금 헤맸습니다. ㅎ

우선 컨텐츠 위젯도 다른 위젯과 마찬가지로 내 저장위젯관리에서 등록 가능한데, 적용하는 부분이.

이부분 입니다.
템플릿변경 > 포스트영역 > 와이드위젯

여기서 설정하셔야해요. 따로 위치지정은 안되더군요 ^^;
유의하시고 적용하시게요 ㅎ

저작자표시 비영리 변경금지