티스토리에서 광고를 배치하는 법중에서 가장 많이 사용하는것이 구글 에드센스 입니다. 
그것도 두개를 본문 상단에 배치하는 법입니다.
여기서는 구글 에드센스 광고 두개를 본문 상단에 넣은 방법을 알아보겠습니다. 이 방법을 알면 다른것도 얼마든지 응용해서 사용할수 있습니다.

알아두어야 할 점.
  • 테이블태크(table)로 넣을것인가? 박스(div)로 넣을것인가? - 참고로 div 로 넣는것을 추천합니다. table로 넣을경우 광고가 검색이 안된다는 글을 본적이 있거든요.(정확한 사실은 아직 모름)
  • 스킨마다 환경이 다를수 있습니다.(어느정도 응용을 할수 있어야 합니다)
  • Cross Browsing(상호호환성) 환경에 맞어야 합니다.특이 IE6.

광고 코드를 넣은법은 3가지로 알아보겠습니다.
  • div id, class 를 만들어서 사용하는 방법
  • 티스토리 에디터에서 제공하는 표만들기를 이용해서 사용하는 방법

div id, class를 만들어서 사용하는 방법.

개인적으로 가장 추천하는 방법이기에 가장 먼저 기술합니다.
제가 여러차례 스킨을 변경하고 코드를 삽입해본결과 한가지 알고 하셔야 할것이 있습니다.
id는 고유해야하고, class는 고유하지 않아도 됩니다.
하지만 구글 에드센스를 넣은 것은 class를 사용하되 고유한 class를 사용하는것이 좋습니다.

이말은 무슨말이냐???
티스토리의 경우를 예를들어 보겠습니다.
300*250 광고를 두개 나란이 넣는다고 가정할경우 이 코드가 본문 상단에 한번만 사용할수도 있지만 다른곳에도 사용할수 있습니다.
즉 공지사항, 검색리스트등에도 사용할수 있다는 것이죠.

그러기 때문에 class(클래스 - 여러번 사용할때 사용함)를 사용하되 스킨의 div id 나 class 명과 중복이 되지 않아야 하기 때문입니다.
다른곳에 넣은 예제를 이미지로 보여드립니다.

공지사항 광고가 없을때

공지사항 광고가 있을때(본문과같은코드사용)

검색리스트에 광고를 넣었을때(본문과같은코드사용)



자 이제 코드를 넣어보겠습니다.
div class 는 제가 임의로 만들었습니다. 아마 그냥 사용해도 될겁니다.치환자나 기타 클래스와 중복되지 않을거 같으니까요.

300*250 짜리 광고코드 두개를 본문 상단에 넣을경우

html 코드는 본문 치환자 바로 위에 넣으세요.
!! 치환자의 경우 ##_치환자_###\#_치환자_## 로 표시됩니다.!!
<!-- 본문내 구글광고 -->
<div class="gAds" >
	<div class="gLeft">
		왼쪽 구글광고 300*250
	</div>
	<div class="gRight">
		오른쪽 구글광고 300*250
	</div>
	<div class="clear"></div>
</div><!-- //본문내 구글광고 -->
[#\#_article_rep_desc_##]<!-- 티스토리 본문 치환자 -->
css 코드는 css 편집창에 붙여넣으세요.
.gAds{
width:600px;
height:250px;
padding:0;
margin:0;  //본문에 포함된 여백을 모두 없애줍니다.
}
.gLeft{
float:left; 
width:50%; //width:250px 를 사용해도 됩니다.
}
.gRight{
float:right: 
width:50%;
}
.clear{clear:both}
한가지 주의해서 보아야 할점은 스킨마다 다르기 때문에 본문에 padding 이 포함될수 있습니다. 그렇기 때문에 gAds에서 padding,margin을 모두 0으로 초기화 시켜줍니다.

다른곳에 배치하는 법.

스타일은 그대로 두고 html코드만 추가해주면 됩니다. 

구글코드는 한 화면에 4개이상의 컨텐츠 광고를 넣을수 없습니다. 즉 3개까지 가능.
티스토리의 특성상 본문,공지사항,검색리스트,방명록,위치로그,태그로그,보호글 등은 한 화면에 하나만 존재합니다.
그러기 때문에 상단에 배치하려면 따로 배치를 해줘야 합니다.
치환자의 경우 티스토리 스킨 가이드를 참고하세요.
더 예제를 보여드릴수 있는데 글이 너무 길어져서 여기까지 합니다.

만약 위의 방법으로 했는데 레이아웃이 망가진다하면 약간 수정해주어야 합니다.
대부분의 스킨에서는 이렇게 삽입하면 되는데 모두 다 되는것은 아닙니다. 

Cross Browsing

레이아웃이 깨진다거나 특이 IE6등에서 깨진다면 다음글처럼 코드를 수정해주시면 됩니다.
글이 길어 다음편에 계속하겠습니다.