Для многих сайтов реклама — единственный источник денег. Поэтому они, Вы, я — размещают её у себя. Но в нашем мире куча блокировщиков рекламы. AdBlock, AdBlock Plus, AdBlock Pro, Ghostery, Adguard. Есть даже встроенные в браузеры (Opera, Яндекс.Браузер). Эти блокировщики блокируют не только рекламу, но и прибыль от сайта. Может, сайт вообще живёт только на рекламе? Так вот. Сегодня расскажу о том, как можно узнать, пользуется посетитель Вашего сайта блокировщиком или нет, а если да — попросить его отключить.
Итак, почему же я выбрал способ просить пользователя отключить блокировщик, а не маскировать рекламу под обычный контент сайта, или вообще не допускать посетителя к сайту (пока он не отключит AdBlock)? А потому, что это есть самый этичный способ, а ещё при пользовании последними двумя способами, можно потерять большую долю уникальных посетителей.
Вот HTML-код моего первого способа.
<!-- Сначала немного стилей. В общем-то, если код обнаружит рекламу, то наверху сайта закрепится сообщение с просьбой отключить AdBlock на красном фоне -->
<style>
.adpopup {
overflow: hidden;
background-color: red;
position: fixed;
top: 0;
width: 99%;
}
.adpopup p {
float: left;
display: block;
color: #000;
padding: 0;
text-decoration: none;
}
</style>
<!-- Так, стили закончились. Дальше идёт скрипт (а точнее функция JS), который выводит то самое красное сообщение -->
<script>
function adBlockFunction() {
document.getElementById('content').innerHTML = ' <div align=center class="adpopup"><p>Уважаемые пользователи сайта! Просим вас отключить блокировщик рекламы! Вместе с рекламой ваш блокировщик блокирует некоторую часть сайта. Также, реклама - единственное средство существования сайта.</p></div>';
} //Внутри функции можно расположить своё уведомление
</script>
<!-- Что тут у нас? Ага, те самые "обнаружители" блокировщиков. И находятся они в двух div'ах (только так работают) -->
<div id="content">
<div> <!-- Первый подключает скрипт рекламы Google. Если он оказывается заблокированным, то выводится наше любимое сообщение -->
<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" onerror="adBlockFunction();"></script>
<!-- Второй по аналогии подключает скрипт рекламы Яндекса -->
<script async src="//an.yandex.ru/system/context.js" onerror="adBlockFunction();"></script>
<!-- Если у вас какая-нибудь другая рекламная сеть, можете найти её адрес рекламного скрипта и подключить сюда таким же способом -->
</div>
</div>
Кстати, расположить код нужно сразу после открывающего тега body.
Спасибо за прочтение статьи! Надеюсь, она Вам пригодилась.
Автор: Валера
