저의 블로그는 아직 애드센스 광고 승인을 받지 못해, 쿠팡 광고를 Ad Inserter를 활용하여 글의 처음과 끝, 그리고 중간 h3 태그 위에 자동으로 삽입하고 있습니다. 이 글에서는 워드프레스 블로그에서 중간 h3 태그 위 또는 아래에 광고를 자동으로 삽입하는 방법에 대해 알아보겠습니다.
워드프레스 블로그에서 중간 h3 태그 위 또는 아래에 광고를 자동으로 삽입하는 방법
1년 가까이 워드프레스 블로그를 운영하고 있지만 아직 애드센스 광고 승인을 받지 못했을 뿐더러 인기도 없어 하루 방문자가 50명이 안 되는 블로그를 지금 여러분은 보고 계십니다. 이대로 있을 순 없다고 생각하여 얼마 전부터 쿠팡 광고를 블로그에 삽입하고 있지만 이마저도 아직 실적이 없는 것을 보면 블로그에 영 소질이 없는 것 같습니다. 그렇더라도 제가 알고 있는 것에 대해서는 대부분 이 블로그에 포스팅하고 있으니 참고하셔서 저처럼 시행착오를 겪지 않으셨으면 좋겠습니다.
다른 분들도 마찬가지겠지만 블로그에 광고가 많으면 왠지 거부감이 느껴지고 잘 들어가지지 않게 됩니다. 그래서 저는 광고가 글을 읽는 데 방해가 되지 않도록 신경을 쓰고 있고, 그에 따라 컴퓨터와 스마트폰에 광고 배치를 달리 적용하고 있습니다.
Ad Inserter를 사용하시는 분들이라면 본문의 특정 위치에 자동으로 광고를 삽입하는 방법에 대해서는 익숙하실 테지만, 이 글에서 소개해 드리는 것처럼 h3 또는 특정 태그의 개수를 파악해서 그 중간에 광고를 삽입하는 방법에 대해서 모르시는 분들도 있을 겁니다.
이 글에서 그 방법을 자세히 설명드리겠습니다.
1. Ad Inserter에 광고코드 추가 및 설정하기
먼저 하실 일은 Ad Inserter에서 사용할 블록을 선택한 후 사용하실 애드센스 광고 코드를 삽입하는 것입니다. 저는 아직 애드센스 승인을 받지 못해 쿠팡 광고 코드를 추가했습니다. 광고 코드를 삽입한 다음, ‘Manual’을 클릭하고 ‘Shortcode’에 체크합니다. adinserter block="11" 또는 adinserter name="Block 11" 은 ‘functions.php’에서 사용할 코드입니다.
‘Save Settings 1 – 16’을 클릭하여 설정을 저장하면 Ad Inserter 설정은 완료됩니다.
2. 테마 파일 수정하기 (functions.php 수정하기)
Ad Inserter 설정이 완료되었다면, 다음으로 functions.php에 필요한 코드를 추가해야 합니다. 저와 같이 중간에 있는 h3 태그 위에 광고 코드가 자동으로 삽입되기를 원하신다면 아래 코드를 그대로 사용하시면 되고, 그렇지 않을 경우 $middle_index = floor($h3_count / 2) + 1;에서 +1을 원하는 위치로 조정하시면 됩니다.
그리고 Ad Inserter에서 사용하신 블록이 저와 다르다면, adinserter block="11" 을 여러분이 사용한 블록 번호로 변경하셔야 합니다.
//h3 태그 갯수를 확인하여 중간에 광고코드가 추가되도록 설정하는 코드
function insert_ad_before_middle_h3($content) {
if (is_single() && !wp_is_mobile()) { // 단일 포스트와 모바일이 아닐 경우 적용
$h3_tags = preg_split('/(<h3.*?<\/h3>)/i', $content, -1, PREG_SPLIT_DELIM_CAPTURE | PREG_SPLIT_NO_EMPTY);
$h3_count = count(preg_grep('/^<h3/i', $h3_tags));
if ($h3_count > 1) { // h3 태그가 2개 이상인 경우
$middle_index = floor($h3_count / 2) + 1;
$ad_code = '<div class="ad-inserter">[adinserter block="11"]</div>'; // Ad Inserter 코드
$h3_found = 0;
$new_content = '';
foreach ($h3_tags as $part) {
if (preg_match('/^<h3/i', $part)) {
$h3_found++;
if ($h3_found == $middle_index) {
$new_content .= $ad_code;
}
}
$new_content .= $part;
}
$content = $new_content;
}
}
return $content;
}
add_filter('the_content', 'insert_ad_before_middle_h3');
워드프레스 관리자 화면에서 ‘모양’ → ‘테마 파일 편집기’를 순서대로 클릭한 후, 오른쪽 사이드에 있는 ‘functions.php’를 선택합니다. 파일의 맨 아래로 이동한 다음 위의 코드를 아래 그림과 같이 붙여넣기한 후 ‘파일 업데이트’를 클릭하여 저장합니다.
3. 결과 확인하기
위와 같이 Ad Inserter 광고 코드 삽입 및 설정, 그리고 functions.php에 필요한 코드를 추가한 후 블로그에 접속해 보시면 아래와 같이 중간 h3 태그 위에 광고가 삽입된 것을 보실 수 있으실 겁니다.
오늘은 워드프레스 블로그에서 중간 h3 태그 위 또는 아래에 광고를 자동으로 삽입하는 방법에 대해 알아보았습니다. 포스팅된 글의 중간에 광고를 자동 삽입하고 싶으신 분들은 이 글을 참고하여 적용해 보시기 바랍니다.