Как вывести сообщение об использовании AdBlock

Немного рассуждений о таком спорном моменте, как реклама на сайте. С одной стороны реклама помогает содержать сайт, ведь хостинг и интернет не бесплатные, да и за домен платить каждый год нужно. И это без учета возрастающих по мере увеличения популярности сайта расходов и затрат на оплату авторам публикаций, если они работают на не безвозмездной основе. С другой же стороны чрезмерное употребление рекламы может отвратить посетителей: если они видят, что сайт сделан только ради рекламы, то навряд ли будут посещать его регулярно. Либо же они будут использовать различные расширения для браузеров, скрывающие рекламу с сайтов. Так что реклама на любом сайте сейчас является палкой о двух концах: если ее не будет, то трудно будет окупить содержание сайта, и со временем такой сайт станет не по карману, если же ее будет слишком много, то это отвратит посетителей сайта, что опять негативно скажется на окупаемости, либо же пользователи начнут использовать расширения AdBlock и другие подобные, подавляющие рекламу, что опять таки приведет к падению доходов. Так что же делать, как поступать вебмастеру, чтобы и посетителей оставить, и доход с рекламы не потерять?

Я вижу выход в разумном сочетании рекламы и контента:

• реклама должна совпадать по тематике с содержимым страницы, и тем самым быть интересной и полезной
• рекламы не должно быть много, ее должно быть ровно столько, чтобы не вызывать отрицательные эмоции
• нельзя принуждать пользователей к рекламе, ее просмотр должен быть добровольным выбором

Есть и еще один момент, чисто эстетический. При удалении рекламы со страницы с помощью AdBlock пользователь ничего вместо нее не видит. Это приводит к не очень приятным последствиям: на странице появляются пустоты, общий дизайн может поплыть. В этом случае неплохо бы придумать какую-нибудь заглушку, которую увидит посетитель вместо рекламы, которую расширение браузера удалит. Решить две задачи (показать вместо рекламы заглушку, если она вырезается расширением браузера, и тем самым не дать нарушить общий дизайн, а так же показать альтернативное сообщение, побуждающее посетителя выключением расширения, блокирующего рекламу, внести свой вклад в развитие сайта) поможет скрипт, определяющий, работает ли AdBlock в браузере посетителя, или нет.

В файл footer.php используемой вами темы, в самый его конец добавьте:

var ads = "no-adblock" 
var msg = '<div class="noadblock">Вы используете расширение AdBlock или подобное. Вы можете добавить этот сайт в белый список, и тем самым внесете свой вклад в его развитие.</div>'; 
   
 onload=function(){ 
if (document.getElementsByClassName == undefined) { 
 document.getElementsByClassName = function(className) 
{ 
var hasClassName = new RegExp("(?:^|s)" + className + "(?:$|s)"); 
var allElements = document.getElementsByTagName("*"); 
var results = []; 
var element; 
for (var i = 0; (element = allElements[i]) != null; i++) { 
var elementClass = element.className; 
if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) 
 results.push(element); 
} 
return results; 
} 
} 
   
 blocked = 0; 
var ad_nodes = document.getElementsByClassName(ads); 
for(i in ad_nodes){ 
if (ad_nodes[i].offsetHeight == 0){ 
 blocked = 1; 
 ad_nodes[i].innerHTML = msg;  
} 
} 
}

Чтобы скрипт работал, нужно код рекламного блока помещать во внутрь DIV с классом no-adblock. Например, вот так это выглядит для рекламного блока Google Adsense:

<div class="no-adblock">
    //тут код рекламного блока
    
    <ins class="adsbygoogle"></ins>
    (adsbygoogle = window.adsbygoogle || []).push({});
</div>

Что делает этот скрипт? Основным действием по скрытию рекламы у расширений типа AdBlock является принудительное уменьшение высоты рекламного блока до нуля. Приведенный скрипт смотрит, как обрабатывается код страницы браузером. Если в коде формируются рекламные блоки, высота которых нулевая, либо если эти рекламные блоки вообще не формируются, то скрипт вместо них принудительно выводит сообщение. Таким образом, если в браузере работает AdBlock или подобное расширение, то реклама отображаться не будет, однако вместо нее будет выводиться ваше сообщение. Это сообщение можно произвольным образом оформить, так, чтобы отсутствующие рекламные блоки не порушили верстку. Для этого достаточно добавить в файл style.css используемой вами темы:

.noadblock {
    padding: 10px; 
    background:#fff; 
    border: 1px dotted #eee;  
    font-size: 18px; 
    line-height: 1.38em;  
    text-align:center; 
    color:#444;
    background: #FFFFD3;
}

Конечно, это информационное сообщение так же можно вырезать, но если оно будет носить безобидных характер, либо вообще будет полезным (например, вместо вырезанной рекламы можно показывать ссылки на интересные публикации), то пойдет сайту только на пользу.