오늘은 애드센스 광고를 우측 상단에 삽입하는 방법에 대해 살펴보겠습니다.
많은 수익형 블로그들이 336×280 큰 직사각형이나 300×250 중간 직사각형 광고를 상단에 연속으로 2개를 나란히 배치하는 곳이 많습니다. 많은 분들이 이렇게 배치한다는 것은 그만큼 높은 수익 경험을 바탕으로, 나름의 효율적인 배치로 보일 수도 있습니다.
주의하실 점은 요즘 모바일 환경이 많은 탓인지 그간 허용해왔던 이런 구도가 광고 배치 위반이 되는 경우가 종종 있습니다. 반응형 광고 코드가 새로이 생기면서 정책 변경이 생긴지도 모릅니다만, 현재까지도 상단 직사각형 2개로 잘 운영되고 있는 곳도 있습니다. 굳이 조금의 수익을 더 얻으려다 광고 금지라도 당하면 안되겠죠?
상단 이미지는 구글 Adsense 안내 페이지의 광고 크기 가이드에 대한 내용입니다. 전형적인 애드센스 광고 레이아웃이죠?
다음은 일반적으로 온라인 신문, 뉴스 매체에서 게재하는 방식입니다. 오늘 설명드릴 우측 상단에 광고를 본문 글과 함께 배치하는 것과 같은 레이아웃입니다.
<출처 : 뉴시스>
대다수의 온라인 뉴스기사는 동일한 광고 배치를 보이고 있습니다. 글의 흐름을 따라가다 보면 좌측상단에서 우측상단으로 흘러가기 때문에, 기사를 읽다 보면 광고에 더 집중 시킬 수가 있기 때문입니다.
커피전문점 이디야의 전략 중 하나가 스타벅스가 있는 상권을 공략하는 거라죠? 스타벅스가 입점한 상권은 어느정도 상권 형성이 잘 된 곳이란 판단을 했기 때문이라고 합니다. 즉, 상권 분석은 스타벅스가 하고 이디야는 그냥 따라 들어가기만 하는 것이죠.
온라인 뉴스, 신문 매체뿐 아니라 수많은 수익형 블로그분들이 동일한 레이아웃을 보이는 것은 그만큼 수익 효율이 높은 배치라고 할수 있습니다. 스타벅스 주변에 입점하는 이디야 처럼요.
그럼 본격적으로 우측 상단에 애드센스 광고 삽입하는 방법에 대해 살펴보겠습니다.
먼저 구글 애드센스 사이트에서 큰 직사각형(336×280)이나, 중간 직사각형(300×250) 광고를 생성합니다. 기존에 생성된 코드를 사용하셔도 무방합니다.
티스토리 관리자 페이지로 이동하신 후 HTML/CSS 편집 메뉴로 이동하세요.
아래 코드를 드래그 한 다음 Ctrl+C 이용하여 복사 합니다.
1 2 3 4 5 6 7 | /* * 우측 광고 CSS 시작 */ .Right_Adsense {float:right;margin-left:20px;margin-bottom:10px} /* * 우측 광고 CSS 끝 */ | cs |
HTML/CSS 화면에서 CSS 탭으로 이동하세요.
복사한 코드를 </body> 바로 위에 삽입합니다. 위치는 어디에 있든 상관 없습니다. <body> 코드삽입 </body> 안에 위치하기만 하면 됩니다.
저장을 하신후 HTML 탭으로 이동하세요.
HTML 화면에서 Ctrl+F 키를 누른 후 _article_rep_desc_ 를 검색하세요.
1 2 3 4 5 6 7 8 9 10 11 12 13 | <!-- 우측광고 삽입 --> <div class="Right_Adsense"> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- Homepage Leaderboard --> <ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-1234567890123456" data-ad-slot="1234567890"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div>
<!-- 우측광고 삽입 끝 --> | cs |
위 코드를 드래그 한 다음 Ctrl+C 이용하여 복사한 후 윗 부분에 삽입합니다.
예시를 위한 샘플 코드이니 HTML 입력시 data-ad-client=”ca-pub-1234567890123456” 부분과 data-ad-slot=’1234567890” 부분은 꼭 본인의 코드로 변경하세요.
애드센스 광고 코드를 삽입하셨다면, 저장 버튼을 눌러주세요.
이제 새로운 글을 발행 할때마다 자동으로 광고가 적용이 됩니다. 글 작성 후 본문 우측 광고와 글들이 나란히 적용된 것을 확인할 수 있습니다.
앞서 확인한 온라인 뉴스 사이트와 동일한 방식의 레이아웃이 완성되었죠? 참고로 광고와 글 사이에 간격을 조절하시려면 margin-left:20px; margin-bottom:10px 부분의 사이즈를 조절하시면 됩니다.
만약 티스토리 애드센스(반응형) 플러그인에 상단 반응형, 하단 반응형을 삽입하여 사용중이시라면 CSS 코드만 적용시킨 후 본문 작성시 해당 클래스만 불러 작성하실 수도 있습니다. 자세한 방법은 아래 이미지를 참고하세요.
그때 그때 직사각형 애드센스를 활용하고 싶다면 위 방법을 사용하시는 것이 좋습니다.
우측 상단 광고가 가장 높은 수익을 보장하는 것은 아닙니다. 블로그의 주제, 성격, 텍스트 위주, 이미지 위주의 블로그가 있듯이, 블로그 성격과 페이지 레이아웃이 다르기 때문에 정답은 없습니다. 상단, 중간, 하단, 우측상단 등과 같이 개별 광고를 생성, 삽입 하신 후 수익을 가장 잘 나오는 곳을 선택하시는 것이 중요합니다.
※ 광고 코드별 수익 확인은 애드센스 페이지에서 광고단위로 확인할 수 있어요.
※ 애드센스 고객센터에서 지역별, 광고 크기 별 수익에 대한 안내 등 좋은 정보가 있습니다. 처음 애드센스를 접하시는 분이라면 한번쯤 읽어보시면 많은 도움이 됩니다.
https://support.google.com/adsense/answer/160374?hl=ko&ref_topic=1307421
지금까지 블로그 글 작성시 우측 상단에 글과 함께 광고를 삽입하는 방법을 살펴보았습니다. 도움이 되셨나요?
'재테크' 카테고리의 다른 글
| 2017 연말정산, 소득공제 완전정복! (0) | 2016.12.03 |
|---|---|
| 블로그 검색누락 한방에 해결하기 (18) | 2016.11.10 |
| 구글 웹마스터도구 사이트맵 등록 (4) | 2016.11.07 |
| 네이버 웹마스터도구 사이트맵 RSS 등록 (16) | 2016.11.07 |
| 애드센스 수익 키워드 검색 - 애드워즈 활용 (2) | 2016.11.03 |