블로그 상단에 구글에드센스(기타 CPC광고 배너) 을 달아보자!!

블로그 상단에 구글에드센스(기타 CPC광고 배너) 을 달아보자!!

2010 년 12월 9일 제 블로그 상단 모습입니다 ^^

자신의 블로그 상단 에 광고를 넣고 싶으시다구요 ??

구글에드센스 (기타 cpc 광고 ) 를 자신의 블로그 상단에 간단하게 넣는 법을 알려드릴께요 !!

일단 필요한 준비는 !! 생각보다 간단합니다. 제 경험상 상단에 광고넣기가 가장 쉬웠으니깐요 !!

우선 티스토리의 관리자 모드로 들어가 스킨 - > "Html/Css" 편집에 들어갑니다.

Sytle.Css 편집 화면이 있죠??

거기에 이 내용을 추가해 줍니다.

/*Style.css 에 추가해야 될 내용 */
.googlead {border:3px solid #ccc; float:center; width:810px; height:285px;}

파란색 = 블로그 상단 광고 박스의 테두리의 선 굵기와 선 색을 설정하는 부분입니다.

앞에 boder:3px 는 선의 굵기 뒤의 #ccc 는 선의 색을 지정해주는 부분입니다.

빨간색 = 테이블의 가로길이(Width)를 잡아주는 부분입니다. 자신의 블로그 본문 가로 크기에 맞게 조절하시면 됩니다 !

초록색 = 테이블의 세로길이(Height)를 잡아주는 부분입니다. 285px 로 한건 구글에드센스 기준으로 정사각형 광고 크기 280px 에 5px 정도 공간을 준

것입니다.

Style.css 편집은 이걸로 끝 !! 그럼 본격적으로 블로그 상단에 구글에드센스를 달아볼까요? Skin.html 편집 화면에서 일단 Ctrl+f 를 눌러줍니다.

위의 그림에서 보듯이 "##_article_rep_desc_##" 를 검색해보시면 노란박스 의 치환자를 볼수 있는데요.

본문상단에 광고를 기재 하는것이니깐 ##_article_rep_desc_## 위에 아래의 소스코드를 입력해주면 됩니다.

(이미지의 코드는 제 광고 코드 입니다..^^ 저런식으로 달면되요!! 단! 본인의 광고 코드를 입력하셔야겟죠?^^;;)

<!-- 구글 에드센스 -->     
<div class=googlead>
<center>
#####이부분에 자신의 구글 에드센스 광고 삽입#####
#####이부분에 자신의 구글 에드센스 광고2 삽입#####
</center>
</div>

초록색인 <center>는 입력 안하셔도 됩니다!! 단 광고를 중앙에 위치하게 하실꺼면 넣어주셔야 되구요 ^^

파란색 부분에 자신의 구글 에드센스 광고 코드를 복사하기 해서 붙여넣기 하시면됩니다.

한개만 다실분은 하나의 코드만 넣으시면 됩니다 ^^

일일이 타이핑 하기 귀찮으시거나 복사하기가 안되시는분은 아래의 소스를 받아주세용!!

소스.txt

※ 코드 수정전 꼭!! 본래의 스킨을 백업후 수정 하시기를 권유 합니다!!

※ 만약의 자신의 상단광고가 테두리를 벗어나거나 가로로 두개 안되시는분은 ~!

본문폭을 늘려주시거나... 하나만 다셔야 됩니다 !!!! 구글에드센스 정사각형 배너의 가로폭은 최고 336px 입니다. 즉 672 이하의 폭에선 두개의 에드센

스 광고를 기재시에 가로정렬이 안되고 세로로 두개 나올수도 있습니다.

본문폭을 늘려주는 방법은.. 관리자 메뉴 - > 스킨 - > 스킨 선택 - > 스킨 위자드에서 하시는게 안전합니다.

Style.css 파일을 수정하면 되긴 하는데.. 자칫 잘못하면 블로그 레이아웃이 완전히 날아가버리는 경우가 생길수도 있습니다

다음 뷰 에드센스를 이용하시는분은 .googlelead 에서 float:center 를 float:left 로 변경해주시고 width 값을 적절하게 수정하시면 뷰에드와같이

상단에 가로정렬을 하실수 있습니다.