티스토리나 워드프레스등 블로그에 애드센스 광고 삽입시 가장 높은 수익과 클릭률을 보여주는것은 상단광고라고할 수 있습니다. 크게 광고는 상단 하단이 기본적이고 부가적으로 본문중간에 삽입하거나 사이드바에 삽입하는게 있습니다.
기존에는 애드센스 광고를 설치할때에는 고정식 사이드바에 삽입하거나 팝업창에 삽입이 금지이며 광고를 연달아 삽입하느것도 금지사항이였지만 이부분은 개정되어 사용해도 애드센스 정책위반이 되지 않습니다.
앞서 말한것과 같이 애드센스 광고수익은 상단광고가 80%라고 할 수 있는데 이 광고를 크게 1개를 달아도 되고 이미지 광고를 2개 달아서 둘 중 1개를 클릭하게 하느것도 나쁘지 않은 방법입니다.
하지만 이렇게 하면 발생하는 단점은 웹페이지 속도가 느려지고 가독성이 떨어질 수 있다는 점인데 홈페이지 속도가 느려지는것은 인터넷 검색노출 및 SEO에 나쁜 영향을 가지기 때문에 서버가 느린 워드프레스나 무거운 테마를 사용중인 티스토리라면 추천하진 않습니다.
하지만 빠른 웹페이지에 비교적 넓은 화면을 제공하는 홈페이지라면 상단에 광고를 1개만 집어넣기에는 다소 허전한 사이트가 있는데 그런경우 상단에 “애드센스 광고 2개” 설정하는것도 좋은 방법입니다.
애드센스 상단 광고 2개 수익상승 방법
애드센스 광고를 상단에 2개 설정하는거으로 상단의 광고를 클릭할 확률은 2배로 증가할 수는 있지만 그만큼 홈페이지의 속도는 저하가 되니 PAGE SPEED를 통해 홈페이지 속도를 측정 후 사용하세요
- 워드프레스 속도개선 참고
그렇기 때문에 서로의 장단점이 존재하는 방식으로서 스퀘어의 작은 광고가 오히려 더 큰 집중도를 보이기도 하는거 같은데 이러한 티스토리 및 워드프레스에 모두 적용가능한 코드입니다.
적절한 광고 위치 선정: 사이트의 가독성과 사용자 경험을 해치지 않으면서도 눈에 잘 띄는 위치에 광고를 배치합니다. 예를 들어, 게시물의 상단, 본문 내부, 하단이 효과적일 수 있습니다.
광고 형식 다양화: 텍스트 광고와 이미지 광고를 적절히 혼합하여 사용합니다. 다양한 형식의 광고를 제공함으로써 클릭률을 높일 수 있습니다.
모바일 최적화: 모바일 사용자가 많은 경우, 모바일 최적화된 광고를 사용하고, AMP 페이지를 구현하여 모바일 페이지 속도를 개선합니다.
타겟팅 개선: 애드센스의 자동 타겟팅 기능을 활용하고, 사이트 콘텐츠와 관련성이 높은 광고가 표시되도록 콘텐츠의 품질을 관리합니다.
A/B 테스트: 다양한 광고 스타일과 위치에서 A/B 테스트를 실시하여 가장 효과적인 광고 구성을 찾아냅니다.
참고로 광고코드가 길수록 홈페이지 접속속도를 저하하기 때문에 광고코드는 짧을수록 좋습니다.
애드센스 상단 광고 2개 설정 코드
<div class="adsense" style="text-align: center; padding:0px 0px 10px 0px;"><table cellpadding="0" cellspacing="0" table width="100%">
<tr>
<td width="50%"> 좌측 애드센스 광고 코드 </script>
</td>
<td width="50%"> 우측 애드센스 광고 코드 </script>
</td>
</tr>
</table>
</div>위 코드를 복사합니다.
그리고 “좌측 애드센스 광고코드” 부분과 “우측 애드센스 광고 코드“에 각각 원하는 자신의 코드를 넣어줍니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.adsense-container {
display: flex;
flex-direction: column;
align-items: center;
margin: 20px 0;
}
.adsense-ad {
margin: 10px 0;
}
</style>
</head>
<body>
<div class="adsense-container">
<!-- 첫 번째 애드센스 광고 -->
<div class="adsense-ad">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-XXXXXXX"
data-ad-slot="XXXXXXX"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<!-- 두 번째 애드센스 광고 -->
<div class="adsense-ad">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-XXXXXXX"
data-ad-slot="XXXXXXX"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</div>
</body>
</html>조금 더 커스텀해서 가운데 정렬로 된 애드센스 광고를 원한다면 위 최적화 된 코드를 사용하세요.
data-ad-client와 data-ad-slot 값을 자신의 애드센스 계정에서 제공받은 값으로 대체하세요.
만약 위 코드가 드래그 복사가 안되는 분들은 메모장 파일을 다운로드 후 실행하세요
워드프레스의 경우 Ad inserter 플러그인을 설치해서 제목 위 제목 아래, 본문 위, 본문 중간, 푸터나 헤더, 사이드바 등에 고정하여 원하는 광고를 설정할 수 있습니다.
스의 Ad Inserter 플러그인을 사용하여 설정할 수 있는 광고 위치는 다양합니다. 아래는 가장 일반적인 광고 위치 옵션을 표로 정리한 것입니다.
| 위치 옵션 | 설명 |
|---|---|
| before post content | 게시물 내용 전에 광고를 삽입합니다. |
| after post content | 게시물 내용 후에 광고를 삽입합니다. |
| before paragraph | 지정된 번호의 단락 전에 광고를 삽입합니다. |
| after paragraph | 지정된 번호의 단락 후에 광고를 삽입합니다. |
| before content | 콘텐츠의 시작 부분에 광고를 삽입합니다. |
| after content | 콘텐츠의 끝 부분에 광고를 삽입합니다. |
| before excerpt | 요약 전에 광고를 삽입합니다. |
| after excerpt | 요약 후에 광고를 삽입합니다. |
| between posts | 게시물 사이에 광고를 삽입합니다 (예: 홈페이지나 아카이브 페이지). |
| before comments | 댓글 섹션 전에 광고를 삽입합니다. |
| after comments | 댓글 섹션 후에 광고를 삽입합니다. |
| before header | 헤더 전에 광고를 삽입합니다. |
| after header | 헤더 후에 광고를 삽입합니다. |
| before footer | 푸터 전에 광고를 삽입합니다. |
| after footer | 푸터 후에 광고를 삽입합니다. |
그리고 티스토리의 경우 애드센스 플러그인을 사용하는 방법도 있지만 저 같은 경우 옜날 방식의 티스토리 HTML 코드를 통해 애드센스 광고를 설정하느것을 선호하는데 그 이유는 2024년부터 티스토리 다음 애드핏 자체광고 때문입니다.
우선 티스토리에서 제목위에 애드센스 광고를 설정하고 싶다면 HTML 설정에서 <Header> 태그를 찾아 </Header> 태그 아래에 넣어주면 됩니다.
티스토리 광고 추가방법