나의 티스토리 블로그는 반응형이라 다음과 같이 하였다. (티스토리 기준작성)
흉내쟁이님 스킨 사용중이므로 이글을 참고
http://ccz-cross.tistory.com/29
그냥 보니 초짜로서 참 힘들다.
1. 구글 애드센스 가입부터
https://www.google.co.kr/adsense/
에 가입한다. 사용할 주소는 본인의 티스토리 주소.
가입후 신청까지 별 어렵지 않으니 이부분은 생략.
며칠 지나면 가입시 적었던 메일주소로 승인 메일이 온다.
그러면 구글 애드센스에 접속하면 광고할 수 있는 화면이 보일 것이다.
2. 구글애드센스 설정
페이지에 넣을 스크립트를 만들자.
구글애드센스 페이지에서 다음 순서로 한다.
자동광고 말고,
광고단위로
원하는 광고타입지정, 나는 첫번째 텍스트 및 디스플레이광고 선택
아래쪽에 코드가 나온다 이것을 일단 복사한다.
3. 티스토리에 붙여넣기
아래 메뉴로 이동
우측에 보기누르고 , 수익을 누른다.
그러면 구글 AdSense 항목이 보일것이다.
이중에서 나는 반응형 스킨이므로 반응형을 선택
광고형태에서 원하는 형태를 선택후
아래쪽에 나오는 빈곳에 붙여넣는다.
나는 상단/하단 형태를 선택했으므로
두 곳에 넣는다.
여기서 잠깐!~~~~
붙여넣기 전에 수정해야한다. 어떻게?? 맨위 흉내쟁이님 블로그
http://ccz-cross.tistory.com/29
있듯이, 코드 일부를 수정한후 붙여넣자.
일단
style = 부분이 있는데 이 곳부터
style="display:inline-block;width:300px;height:600px"
와 같이 바꾸자.
자 그럼 다음으로,
상단에 붙여넣을 코드
data-ad-format="auto"
라고 되어 있는 것을
data-ad-format="horizontal"
로 변경하면 아래와 같이 된다.
블라블라블라는 각자의 값이 있을 것이므로 알려주지 않기!!
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ab1 -->
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:600px"
data-ad-client="ca-pub-블라블라블라블라"
data-ad-slot="50블라블라블라"
data-ad-format="horizontal"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
이 것을 아래에 붙여넣는다.
하단에 붙여넣을 코드는
data-ad-format="auto"
이부분을
data-ad-format="rectangle"
로 바꾸고 마찬가지로 전체를 붙여넣기.
변경사항 적용한다.
이제 블로그를 새로고침해보면,
게시물을 클릭해서 내용이 보일때, 내용상단과 하단에 광고가 600*300 사이즈로 보이게 된다.
추가
본문과 광고 여백을 적당히 주도록 다음과 같이 CSS 파일에 준다.
티스토리 - 관리-스킨편집에 들어가서 HTML편집을 누르고
우측에 CSS 탭을 클릭후
내용 맨 하단에 붙여넣자.
/* 애드센스 */
.adsence-ct {margin-bottom: 15px}
.adsence-cb {margin-top: 15px; margin-bottom: 30px;}
.module-ad {margin: 15px 10px;}
사이드바 부분
스킨편집에서(흉내쟁이님 스킨 CCZ-CROSS 에서 해당)
html
스타일만 사이드바 폭 규격에 맞게 바꾸었다.
<s_sidebar_element>
<!-- 구글광고 -->
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ab1 -->
<ins class="adsbygoogle"
style="display:inline-block;width:300px;height:600px"
data-ad-client="ca-pub-xxxxxxxxxxxxxxx"
data-ad-slot="xxxxxxxxxx"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</s_sidebar_element>
