티스토리 본문 상단 하단에 애드센스 달기

구글 애드센스는 지금은 바뀌었는지 모르겠지만,

제가 아는 한.. .한 페이지에 광고 3개까지 달 수 있는 걸로 알고 있는데요..

오늘은 가장 기초적으로 본문의 상단과 하단에 

광고를 넣는 방법을 알아보겠습니다.

핵심 요약

1. 구글 애드센스에서 광고코드 가져오기

2. 티스토리 본문 HTML/CSS 설정 페이지에 애드센스 광고 코드 삽입

1. 구글 애드센스에서 광고코드 가져오기

제가 이번에 가져오는 광고는 가로X세로 300X250 중형 직사각형 크기의 광고코드를 생성하였습니다.

위의 애드센스 코드를 복사해서 티스토리 본문 HTML/CSS 설정에 삽입해주면 끝입니다.

2. 티스토리 본문 HTML/CSS 설정 페이지에 애드센스 광고 코드 삽입

애드센스의 광고 코드를 복사했으면 이제 티스토리 블로그 본문에 삽입해야 하는데요..

티스토리 관리 페이지 -> 꾸미기 -> HTML/CSS편집 

여기서 애드센스 광고코드를 삽입해주면 됩니다.

HTML/CSS에서 [ ##_article_rep_desc_## ]  <= 이 부분이 티스토리에서 본문을 나타내는 치환자입니다. 

그래서 이 치환자 위에 광고 코드를 넣어주면 티스토리 본문 상단에 광고가 달리고요.

치환자 하단에 광고 코드를 삽입하면 하단에 광고가 달립니다. 

[ ##_article_rep_desc_## ]

<!-- 본문 상단 광고 시작-->

애드센스 광고 코드 삽입

<!-- 본문 상단 광고 종료-->

[ ##_article_rep_desc_## ]

<!-- 본문 하단 광고 시작-->

애드센스 광고 코드 삽입

<!-- 본문 하단 광고 종료-->

지금 위에 부분에 광고를 삽입하게 되면

상단광고는 다음처럼

하단광고는 다음처럼 달리는 것을 확인 하실 수 있습니다.

참고로 상단은 300X250 하단은 320X100 크기의 광고를 삽입하였습니다.

그런데 배치가 왼쪽에 붙어 있어서 보기 싫은 것을 확인할 수 있습니다.

가운데 정렬을 해주고 싶은데요..

가운데 정렬을 의미하는 <P align = "center">를 삽입해보겠습니다.

<P align = "center">

<!-- 본문 상단 광고 시작-->

<P align = "center">

애드센스 광고 코드 삽입

<!-- 본문 상단 광고 종료-->

[ ##_article_rep_desc_## ]

<!-- 본문 하단 광고 시작-->

<P align = "center">

애드센스 광고 코드 삽입

<!-- 본문 하단 광고 종료-->

위에 부분처럼 코드를 사입하면

다음처럼 광고가 가운데 본문에서 가운데 정렬되어 나오는 것을 확인 할 수 있습니다.

어때요 쉽죠. 한번 따라해보세요!!

이게 기초로 2단 배치나 여러가지 응용이 가능합니다.