<텍스트 큐브> 구글 애드센스 배치하기

블로그 광고 배치하기

구글 애드센스의 광고도 설정설정 했고, 단위 코드까지 얻으셨다면
이제 블로그에 코드를 입력 하시면 됩니다.
제제 블로그 본문 상단에도 구글 애드센스 광고가 배치 되 있습니다.

텍스트텍스트 큐브에서도 스킨편집 기능이 생겨 광고를 배치 할 수 있습니다.
이 글도글도 텍스트 큐브를 기준으로 설명하겠습니다.

텍스트 큐브의 관리자 모드에서 스킨 편집을편집을 할 수 있습니다.
skin.html 에서 코드를 직접 붙여넣기를 하셔야 합니다.

1. 본문 상단에 광고 배치하기

skin.html 에서 본문의본문의 시작 지점을 찾으셔야 합니다.
Ctrl + F 를 눌르셔서 찾으셔도 되고,되고, 직접 소스를 보면서 찾으셔도 됩니다.
찾아야 하는 부분은

  <div class="article">  

이 코드를 찾으셔서 코드 윗 부분에 애드센스 코드를 입력하시면 됩니다.

2. 본문 하단에 광고 배치하기

위의 내용처럼, 이번엔 본문본문 하단 부분을 찾으셔야 합니다.

 <div class="communicationTrail">

이 태그는 트랙백과 댓글의 시작부분을 나타내는나타내는 태그입니다.
그래서 본문 내용의 하단에 배치하기 위해서는 <div class="communicationTrail"> 태그 윗부분에윗부분에 코드를 입력하시면 됩니다.

3. 광고 2개 가로로 배치하기.

이 내용은 꼭 애드센스만 되는건 아닙니다. 다른 광고에도 구글 애드센스 처럼처럼 코드로 제공이 된다면 가능합니다.
2개로 배치하는 방법은 다른 블로그에서도 많이 볼볼 수 있습니다.
하지만, 편함을 위한(?) 인지는 잘 몰르겠지만, 태그의 선택을 Table로Table로 작성된 코드 였습니다.
저는 굳이 Table 태그 보단 Div 태그로 배치배치 해 봤습니다.

이 코드는 현재 제가 사용하고 있는 코드 입니다.

<!-- 구글 광고 -->
<div class="google_wrap" style="overflow:hidden; width:100%; height:250px; padding-bottom:5px;border-bottom:1px solid #eee;">
<div style="width:300px; float:left;">
왼쪽 구글 애드센스 코드 입력부분
</div>
<div style="width:300px; float:right">
오른쪽 구글 애드센스 코드 입력부분
</div>
</div>
<!-- //구글 광고 -->

전체를 감싸고 있는 div의 스타일에 padding-bottom:5px; 을 준 이유는 처음 구글 애드센스 설정을 할때 테두리를 설정 안해서 광고 아랫부분에 선(border)을 하나 표시해줬습니다. 광고와 선이 너무 붙어보여서 여백을 주기 위한 값입니다. (padding과 border는 삭제하셔도 상관 없습니다.)

width값은 광고의 넓이값을 적으시면 됩니다.
하지만 굳이 width값을 입력하시지 않아도 됩니다. 그냥 삭제하셔도 무방합니다.
저는 width값을 지정해준건 저의 습관일 수도 있습니다;;;

http://www.webuit.com 블로그자료입니다