[구글 애드센스] 티스토리 본문 중간, 상단, 하단 애드센스 광고 삽입 여러 가지 방법 정리

반응형

티스토리 반응형 스킨에 애드센스 광고를 넣는 방법(반응형 스킨 사용자만 보세요!)

티스토리 자체 모바일 웹 버전과 티스토리 앱에서도 광고 나오게 하기를 중점으로 요약해보았습니다. 광고를 삽입하는 방법과 광고 위치 광고 모양 등 다양한 방법들이 존재합니다.

처음 광고를 적용할 때 어떤 모양으로 할지 어느 곳에 위치시킬지 광고를 몇 개를 넣을지 어떤 방법으로 삽입시킬지 등등 여러 고민을 하게됩니다.

그래서, 여러 가지 방법들을 제 블로그를 통해 테스트를 해보고 정리를 한번 해보았습니다. 우선 본문 상단 광고부터 설명 들리도록 하겠습니다. 본문 상단 광고에는 보통 두 가지 유형을 가장 많이 사용하는 것 같습니다.

첫 번째는 본문 상단에 일자형(가로가 긴 형태의 광고)

두 번째는 정사각형 모양인데 위치가 최상단(본을 글 바로 위)과 본문 상단 우측 또는 좌측이냐로 나누어집니다. 

이중 저는 두 번째 유형인 정사각형 모양의 광고를 본문 상단 우측으로 위치시켰습니다.

위치에 따른 광고 클릭률 같은 것은 배제하고 우선 모양 즉, 디자인적인 측면만 가지고 배치를 했습니다. 디자인이라는 게 사람마다 느끼는 차이는 있겠지만요.

자 모양과 위치를 정했으니 깐 어떤 방법으로 광고 코드를 넣을지 알아봅시다. 검색을 해보면 총 네 가지 방법들이 있더군요.

번째 티스토리 플러그인을 이용한다.

번째 스킨 편집 창을 이용한다. 

번째 글쓰기 창에 직접 또는 서식을 이용한다.

번째 자바스크립트를 이용한다.

위 4가지 방법 정도로 압축이 됩니다. 본문 상단일 경우 가장 많이 사용하는 방식은 플러그인을 이용하거나 스킨 편집창 html 쓰는 곳에 넣는 경우가 아닐까 생각됩니다.  그런데 반응형 스킨 본문 상단 광고에서 위 4가지 방법들을 테스트해보니 각각 장단점이 있었습니다. 

티스토리 애드센스 플러그인을 사용할 경우 가장 편하고 확실한 방법입니다. 왜냐고요? 위 4가지 방법 중 첫 번째 방법인 플러그인을 사용하는 경우와 세 번째 방법인 글쓰기 창(에디터 창)에 직접 코드를 넣을 때에는 PC번전에서도 보이고 모바일 웹 버전과 티스토리 앱에서도 보입니다. 이게 제가 테스트한 결과 중 가장 중요한 사항입니다.

참고: 부제목이 반응형 스킨입니다. 반응형 스킨에 대한 얘기입니다. 그중 티스토리 반응형 스킨에 애드센스 광고를 넣는 방법 중 티스토리 모바일 웹 버전과 티스토리 앱에서도 광고 나오게 하기를 중점으로 설명 중입니다.

난 반응형 스킨이라 티스토리 자체 모바일 웹 버전은 사용하지 않는다고 체크했는데 모바일 웹 버전 이랑 뭔 상관이야 하고 생각이 되죠? 그런데 말리죠 모바일 버전을 사용하지 않는다고 체크했어도 접속은 됩니다. 본인 티스토리 주소 마지막에 m을 넣으면 티스토리 자체 모바일 버전으로 갑니다.

http://boogong.tistory.com/m

모르셨던 분들은 한번 해보세요. 물론 일부러 이렇게 접속하시는 분은 없겠지만요. 그런데 뭐가 중요하냐고요.

티스토리 모바일 앱을 사용하시는 분들이 있죠. 저도 댓글 알람 때문에 사용합니다. 이 티스토리 모바일 앱에서는 반응형 스킨이라도 본문 내용이 티스토리 자체 모바일 웹 버전처럼 나옵니다.

또, 카카오 채널 아시죠. 카카오톡에 보면 채널이라는 게 있죠. 이곳 메인에 본인 블로그가 게재되는 경우가 있습니다. 여기에 게재가 되면 엄청난 방문자가 생긴다고 합니다.

어떤 분 말로는 하루에 4만 명이 접속하셨는데 광고 클릭은 평상시와 또 같았다고 합니다. 채널에서 접속한 화면을 보니 광고가 하나도 안 나왔다고 합니다. 그래서 반응형 스킨이라도 티스토리 자체 모바일 웹 버전에도 신경을 써야 한다는 거죠.

그럼 어떻게 해야 나올까요? 앞서 말씀드렸듯이 애드센스 플러그인을 사용하시던지 아니면 글쓰기 창에서 글을 쓸 때 직접 코드를 넣는 방법밖에는 없습니다.

왜냐고요 이 모바일 웹 버전과 티스토리 앱은 본문에 있는 내용만을 가져갑니다. 즉, 스킨 편집창 html에 넣는 경우와 자바스크립트를 이용해서 본문으로 광고를 이동시키는 경우에는 모바일 웹 버전에서 안 나오는 이유는 본문 내용만 가져가서입니다. 티스토리 치환자 중 ##_article_rep_desc_## 이 부분만을 가져가니깐 이거 위에 작성하거나 아래에 작성한 내용은 안 나 오죠.

카카오톡 채널 메인에 있는 티스토리 블로그를 카카오톡 앱에서 접속하면 모바일 웹 버전으로 접속되는 것을 알 수 있습니다. 

 
그럼 저는 어떤 방식으로 하냐 구글 애드센스 반응형 플러그인 방식과 글쓰기 창에 직접 넣는 방식을 혼용해서 사용합니다.

 
광고를 본문 상단과 하단에 사각형 광고나 가로형 광고를 넣을 때는 그냥 구글 애드센스 플러그인만 사용해도 됩니다.

 
저처럼 본문 상단 우측에 위치시킬 경우나 중간광고 또는 하단광고의 위치변경이나 모양 등을 반응형에 맞게 하려면 애드센스 코드를 글쓰기 창에 직접 넣고요.

 
구글 애드센스 반응형 플러그인안에는 스타일 코드를 넣습니다. 만약 애드센스 코드도 플러그인 안에 넣으면 안 되냐고요 네 안됩니다. 상단 우측에 위치시킬 경우임) 간략하게 설명하려고 했는데 글이 너무 길어졌습니다.

 
요약하자면 
번째 난 티스토리 자체 모바일 웹 이건 앱이건 카카오톡 채널이건 다 필요 없다. 그냥 티스토리 내 주소로 접속하는 또는 검색으로 들어오는 것만 잘 나오면 된다. 그러면 어떤 방법으로 사용하든 상관없습니다. 본인이 편한 방식을 사용하면 됩니다. 
 
번째 난 모바일 웹 버전까지도 광고를 나오게 하겠다. 그런데 광고 모양은 본문 글 바로 위에 정사각형이든 긴 사각형이든 넣겠다 그러면 구글 애드센스 플러그인을 사용하시면 됩니다 
 
번째 난 모바일 웹 버전에서도 광고 위치 난 모양을 잡고 싶다 그러면 저처럼 혼용을 하면 됩니다. 광고 코드는 글쓰기 창에 직접 넣고 스타일 코드는 구글 애드센스 반응형 플러그인에 넣으면 됩니다. 
*참고 혼란이 있을까 봐 중간 중간에 말씀 들립니다. 지금 현재 반응형 스킨사용자중 본문 상단 광고에 해당하는 내용을 설명 중입니다.
 
여기서 이런 궁금증이 생길 것 같아 한 가지 더 설명해 드립니다.

 
반응형 스킨에서 플러그인을 사용 할 경우 그럼 구글 애드센스 (PC) 플러그인 과 모바일용 플러그인을 썩어 사용하면 되지 않냐는 생각을 할 수 있는데요 네 맞습니다. 이렇게 사용해도 됩니다.

 
단 웹 버전과 모바일 웹 버전에 들어가는 광고 아이디가 같아야 합니다. 그렇지 않으면 문제가 생깁니다. 모바일 웹 버전에 접속자가 없어 노출이 안 되면 애드센스 광고가 자동으로 중단됩니다.

 
그리고 PC용 플러그인은 위치를 오른쪽과 왼쪽으로 할 수 있는데 문제는 정해진 크기 중 하나만 사용 할 수 있습니다. 즉 데스크탑 PC로 접속할 경우와 노트북 또는 태블릿 PC처럼 화면 작은 해상도일 때 광고 크기가 반응을 해야 하는데 그렇지 못하죠.

 
광고가 화면을 넣어 가는 경우가 생깁니다. 또한, 모바일 웹 버전에서는 위치 변경이 안 되고요. 크기나 모양도 정해져 있습니다.

 
참고 반응형 광고 테스트는 브라우저 화면을 작게 했다 크게 했다 하면서 테스트할 수 있는 데요. 광고가 나오고 나서 화면 조정을 하시면 안 되고요 화면을 최대한 작게 해서 새로고침해서 보고 또다시 화면을 최대로 크게 해서 보면 크기가 변하는 것을 확인할 수 습니다. 현재 보고 있는 제 블로그로 테스트해보세요!  여기까지 반응형 스킨 본문 상단 광고 넣기였습니다.

본문 중간 광고의 경우에는 모바일 웹 버전과 티스토리 앱에서 나오게 하려면 무조건 글쓰기 창에 직접 애드센스 코드를 넣어야 합니다. 여기서도 위치를 이동시킬 거나 여백을 줄 수 있습니다. 스타일 코드를 인라인으로 넣으시면 됩니다. 제 경우에는 중간 광고 중 링크형 광고는 PC에서는 한 줄로 나오고 모바일에서는 2줄로 나오게 하고 있어 미디어 쿼리를 사용함으로 스타일 코드를 반응형 플러그인에 넣었습니다.

마지막으로 본문 하단 광고입니다.

본문 하단 광고는 본문 상단 광고와 같습니다. 여기서도 티스토리 자체 모바일 웹 버전과 티스토리 앱에서 나오게 하려면 글 작성할 때 글쓰기 창에 직접 코드를 넣거나 플러그인을 사용하시면 됩니다.

본문에 직접 넣는 경우와 플러그인으로 넣는 경우에 차이점은 위치가 조금 다르다는 것입니다. 플러그인으로 넣으면 모바일 창 최 하단에 위치합니다. 만약 텐핑(10 ping) 같은 다른 광고가 있다면 이 광고 밑으로 들어가게 됩니다. 본문에 직접 넣은 것은 본문 끝나는 부분에 나타나니 참고하세요’ 

반응형
그리드형