티스토리에 삽입할 애드센스 코드와 서식 생성하기

블로톡( http://cafe.naver.com/blogblogcokr )을 보다보면

티스토리 모바일 버전에서 광고를 넣고 싶은데...

고생하시는 분들을 종종 볼 수 있다.

그래서 한번 만들어 봤다.

광고 크기와 배치도 변경하고... 프로그램도 테스트할 겸...

지금 이 글도 아래 프로그램을 이용해서 만든 서식과 광고 코드를 사용하고 있다.

cafe24에서 저~렴한 호스팅을 이용하고 있어 트래픽이 많으면... 그건 그때가서 고민하자.

자세한 사용방법은 나중에 올리기로 하고...

기본은 기존에 작성했던 글을 바탕으로 하고 있다.

2013/06/04 - [블로그] - 티스토리 모바일에 광고 넣기

2013/06/05 - [블로그] - 티스토리 모바일에 광고 넣기... 서식활용

2013/06/06 - [블로그] - 티스토리 모바일에 광고 넣기... javascript 이용

그럼 시작합니다.

자세한 이용방법은...

언제 작성하게 될지 모르겠습니다... ^^;

2013/07/23 - [블로그] - 티스토리 서식과 애드센스 코드 생성 - 사용법(1/2)

2013/07/23 - [블로그] - 티스토리 서식과 애드센스 코드 생성 - 사용법(2/2)

사용예>

2013/07/20 - [블로그] - 애드센스 광고 시험 - PC 상단 좌측 1개, 중간 우측 1개, 하단 중앙 1개 / 모바일은 상,중,하

2013/07/23 - [블로그] - 애드센스 광고 시험 - PC 상단 2개, 하단 중앙 1개 / 모바일은 상,중,하

혹시 의문사항은 댓글을 남겨주세요.

그리고 한가지 더!

그럴 일은 없겠지만

혹시나 이것으로 문제가 발생(애드센스 정지 등)해도

책임지라고는 하지 마세요.

---

애드센스 코드를 별도 파일(자바스크립트 파일) 로 저장하면 어떤 점이 장점일까?

우선, 여러개의 글을 수정할 때 편리하다.
80개가 넘는 글도 1분도 걸리지 않고 수정했다. (서식 부분을 변경할 경우는 어쩔 수 없이 모두 수정해야 한다.)

또한, 광고 크기나 배치를 변경할 때도 자바스크립트 파일만 변경하면 된다.

그전에는 PC에서 상단 2개, 하단 1개 / 모바일에서는 상-중-하 각 1개씩 있었다.

이번에 변경하면서 PC/모바일 모두 상-중-하 각 1개로 변경했다.

또한, 모바일 상단도 기존에는 300*250 이였는데 지금은 320*50 으로 변경하여
구글 정책에 위배되지 않도록 했다. (2013/07/11 - [블로그] - 애드센스 게재위치에 따른 정책위반)

---

20130720

IE8 이하에서 광고크기만큼 빈공간이 보이는 에러는 수정하였으나

카테고리를 클릭 했을 때 처럼 한 페이지에 글이 여러개 나오는 경우 문제가 있음.

document.getElementById(...)를 사용하기 때문에... 수정해야 한다.

20130722

jQuery를 사용하도록 변경했고

위에 이야기한 오류도 수정했다.

그리고... 비동기 방식을 사용하도록 했다.

사용 예>

2013/07/20 - [블로그] - 애드센스 광고 시험 - PC 상단 좌측 1개, 중간 우측 1개, 하단 중앙 1개 / 모바일은 상,중,하

2013/07/23 - [블로그] - 애드센스 광고 시험 - PC 상단 2개, 하단 중앙 1개 / 모바일은 상,중,하

20130724

개선할 점

1. 애드센스를 삽입하는 자바스크립트 파일을 3개씩 만들지 말고 하나로 처리하자.

2. 모바일 메인(글 목록)에서는 광고영역 이라는 글자가 노출된다.

변경완료.

20130930

한 페이지에 컨텐츠광고와 링크광고를 각각 3개씩 넣을 수 있어

링크광고 영역을 별도로 추가 했습니다.