Настройка альтернативных блоков вместо заблокированной рекламы

Давайте разберем такую ситуацию… Вы блогер, любите писать статьи и делиться ими с людьми. И вы хотите иметь возможность посвящать этому занятию больше времени. А для этого нужно, чтобы это занятие приносило какую-то прибыль. И при этом вы не хотите брать деньги напрямую с читателей. И вы нашли для этого прекрасную возможность — размещение рекламы от Google Adsense и прочие блоки с контекстной рекламой. Но все оказывается не так радужно из-за блокировщиков рекламы…

Настройка альтернативных блоков вместо заблокированной рекламы Адсенса

А ведь такая реклама вполне прилична, при этом отлично вписывается в формат страниц вашего сайта, тематическая и даже может приносить пользу вашим посетителям. Но из-за блокировщиков рекламу на ваших сайтах почти никто не видит, соответственно теряется возможность окупать затраченные на написание статей время и силы. Как быть? В этой статье я поделюсь с вами оптимальным на мой взгляд способом решения проблемы.

Какой контент размещать в альтернативных блоках

Самый популярный (кроме игнорирования проблемы) способ, который обычно применяют вебмастера — это отображение блока с просьбами отключить блокировщик рекламы (при его обнаружении), например, добавив сайт в исключения. Однако, на мой взгляд, подобные плаксивые просьбы совершенно не эффективны — большинство пользователей просто проигнорируют их.

Если ваша главная цель — монетизация сайта без излишнего раздражения пользователей и с учетом факта наличия блокировщиков, то гораздо более эффективный способ — показывать блокирующим рекламу пользователям блоки с альтернативной рекламой, которую эти самые блокировщики не будут блокировать. Что именно будет в этих блоках — решать вам.

Я предпочитаю обычные текстовые блоки с кратким описанием и ссылками на партнерские сайты, на которых платят комиссию за привлеченных пользователей. При этом обычно я сам являюсь активным пользователем сервисов, рекламу которых я размещаю, то есть подобные блоки носят не только рекламный, но еще и рекомендательный характер, то есть я искренне рекомендую понравившиеся мне сервисы. Ну а текстовый формат позволяет исключить обнаружение таких блоков блокировщиками рекламы. В моем случае эти блоки выделены цветом, чтобы не путать пользователей и не создавать ощущение, что они являются частью статьи.

Вы видите эти цветные блоки? Значит, у вас установлен блокировщик рекламы и вы не хотите поддержать меня в возможности написания новых статей для этого сайта. Ай-ай-ай, как не стыдно 🙂
Ну да ладно, я на вас не обижаюсь, просто воспользуйтесь одной из моих рекомендаций и зарегистрируйтесь по моей ссылке в одном из упомянутых сервисов, буду очень благодарен.

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

В общем, о чем речь и для чего это нужно, мы вроде разобрались. Теперь расскажу, как технически реализовать размещение подобных альтернативных блоков на примере сайта на WordPress и рекламных блоков от Google Adsense. Впрочем, те же принципы можно использовать на сайте с любым движком и любой заблокированной рекламой.

Как технически реализовать блоки, альтернативные заблокированной рекламе от Google Adsense

Первым делом нужно написать и сохранить у себя на сайте скрипт, который будет выполнять нужный нам функционал — определять, блокируются ли блоки контекстной рекламы от Google Adsense, и если блокируются — показывать на их месте альтернативные блоки. Сделать это не просто, а очень просто — нам достаточно будет одного небольшого JS-скрипта с примерно следующим содержимым:

window.onload = function(){setTimeout(function(){var swt = document.querySelector("ins.adsbygoogle");if (swt && swt.innerHTML.replace(/\s/g, "").length == 0) {var RandomAltCon = [

'Первый вариант содержимого альтернативного блока',
'Второй вариант содержимого альтернативного блока',
'Третий вариант содержимого альтернативного блока',
'Четвертый вариант содержимого альтернативного блока',
'N-ный вариант содержимого альтернативного блока'
];

document.getElementById("AlternateContents1").innerHTML = RandomAltCon[Math.floor(RandomAltCon.length * Math.random())];
document.getElementById("AlternateContents2").innerHTML = RandomAltCon[Math.floor(RandomAltCon.length * Math.random())];
document.getElementById("AlternateContents3").innerHTML = RandomAltCon[Math.floor(RandomAltCon.length * Math.random())];
}}, 2000);};

Внимательно посмотрите на код выше. Вот его примерное описание:

  • Первая строка проверяет, нулевой или нет размер у рекламного блока Google Adsense (он нулевой в случае блокировки).
  • Затем идут строки с содержимым альтернативных блоков, по одному блоку на каждую строку. Здесь вы можете заключать в одиночные кавычки практически любой текст, включая html-теги. Только не забудьте, что после последней строки не нужно ставить запятую.
  • Наконец, последние строки кода определяют, что на месте каждого рекламного блока Google Adsense в случае блокировки должен отображаться случайным образом выбранный код из массива строк выше. По правилам Google Adsense рекламных блоков может быть не больше, чем 3 на странице, соответственно этих правил тоже три. Важный момент — рекламные блоки должны быть обрамлены контейнерами (например, div-ами) с указанными в скобках id (в примере это “AlternateContents1”, “AlternateContents2”, “AlternateContents3”, но вы можете использовать какие угодно другие id).
  • Наконец, обратите внимание на число «2000» в самом конце кода. Оно определяет, через какое время (в миллисекундах) после загрузки основного содержимого страницы будут показаны ваши альтернативные блоки. Эта пауза нужна, чтобы успели отрисоваться рекламные блоки и скрипт смог определить размер блока (нулевой или нет, см. первый пункт). В примере задано значение 2000 (то есть 2 секунды), но вы можете поэкспериментировать с этим параметром и изменить его на свое усмотрение.

Итак, скрипт готов, теперь его нужно заставить работать. Это можно сделать как минимум двумя простыми способами.

Первый способ — прописать его прямо в теле страницы, обрамив его тегами <script></script> и разместив где-нибудь до закрывающего тега </body>. В случае с WordPress разместить код в таком случае нужно в индексном (или любом другом подходящем) файле вашей темы.

Второй способ — сохранить скрипт в отдельный js-файл. Опять же, если у вас сайт на WordPress, то нужно прописать запуск этого скрипта в файле functions.php вашей темы. Например, если вы разместите скрипт в корневом каталоге вашей темы, то нужно будет добавить следующую строку в файле functions.php (здесь script.js — название файла скрипта):

wp_enqueue_script( 'custom-script', get_stylesheet_directory_uri() . '/script.js', array('jquery'), null, false );

Собственно, это и весь рецепт, все действительно очень просто. Не забудьте только, что сами рекламные блоки от Google Adsense должны помещаться в контейнерах типа <div id="AlternateContents1"></div>, чтобы скрипт мог их проанализировать и обнаружить блокировку.

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

document.getElementById("AlternateContents1").innerHTML = RandomAltCon[Math.floor(RandomAltCon.length * Math.random())];

…и заменить ее на следующую (здесь нужно заменить текст в конце строки на необходимый вам, и проделать то же самое для всех трех блоков):

document.getElementById("AlternateContents1").innerHTML = "Содержимое первого альтернативного блока";

На этом все, буду рад пообщаться на тему статьи в комментариях.


Оставить комментарий

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *