Показать альтернативный контент для пользователей с AdBlockers

Question

Я работаю над проектом, финансируемым рекламой. Действительно что-то тонкое и осведомленное, а не хромое всплывающее окно для увеличения половых органов и т. Д.

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

Как отобразить альтернативный контент для людей с блокировщиками рекламы? Что-то вроде

Мы заметили, что у вас есть активный блокировщик рекламы. Example.com финансируется за счет рекламы, мы обещаем, что наша реклама высокого качества и ненавязчива. Лучшая помощь, которую вы могли бы оказать, чтобы мы работали, - это внести нас в белый список в вашем блокировщике рекламы. Спасибо!

Как я могу проверить блокировку рекламы?

Нашел пример! http://mangastream.com

Answer 1

Блокировщики рекламы в основном манипулируют некоторыми элементами с помощью некоторых идентификаторов или jQuery, таких как правила выбора, которые хранятся в их базе данных, это делается через некоторое время после того, как DOM готов.

Таким образом, вы должны проверить, манипулируют ли вашими рекламными элементами или нет, через определенное время, например, через 3 секунды после готовности DOM. Вы можете просто проверить CSS-свойство display (потому что AdBlockers скрывает это) или innerHTML вашего рекламного элемента. Ниже приведен пример:

Рабочая демоверсия: http://jsfiddle.net/cxvNy/ (протестировано с использованием AdBlock для Chrome , вам необходимо иметь этот актив)

Если HTML-код объявления:

<div id="google_ads_frame1">aa</div>

Тогда:

$(function(){
   setTimeout(function(){
      if($("#google_ads_frame1").css('display')=="none") //use your ad's id here I have used Google Adense
      {
          $('body').html("We noticed you have an active Ad Blocker. Example.com is ad funded, we promise our ads are of high quality and are unobtrusive. The best help you could provide to keep us running, is to whitelist us in your ad blocker. Thanks!");
      }
  },3000);
});

Надеюсь, приведенный выше код говорит сам за себя:)

Answer 2

В конце концов я использовал следующую реализацию (аналогично этого сайта). Используется следующий код:

function abp() {
    if ($('.ad').height() == 0) {
        $('.ad').css("height", "90px");
        $('.ad').css("background-image", "url(/static/images/msblock.png)");
    }
}
$(abp);

В самом конце документа. Кажется, работает как профессионал. Спасибо всем за отличные ответы, за все проголосуем!

Answer 3

Съемка с бедра здесь, но, возможно, вы сможете проверить содержание div вашей рекламы с помощью некоторого JavaScript после загрузки страницы.

<!-- html -->
    <div id="MyAdDiv">
       <div id="BeaconContainer" style="display:none">I rendered!</div>
       // Ad content here.  
    </div>

// javascript

    var d = document.getElementById("MyAdDiv");

    if ( d.innerHTML.indexOf("I rendered!") === -1 )  {
       // Your ad has been blocked.
       // Run code to launch WhiteList request message.
    }

Я не знаю точно, когда адблокер делает это, поэтому было бы неплохо отложить выполнение этой функции на несколько секунд с помощью setTimeout () . Вероятно, есть некоторые интересные вещи, которые вы можете сделать с некоторыми вызовами ajax, например, сбор статистики о том, сколько пользователей используют блокировщики рекламы. Менеджмент просто любит такие вещи.

UPDATE: Я только что установил adblock для Chrome и проверил его на StackOverflow. Похоже, что AdBlock просто удаляет содержимое рекламного контейнера, поэтому приведенный выше метод будет работать.

Answer 4

Это можно сделать и с помощью простого JavaScript, без использования jQuery.

<script>
window.onload = function(){
  setTimeout(showAdblockImage, 3000); 
};
function showAdblockImage(){
    //get all google ad elements
    var adsList = document.querySelectorAll("ins.adsbygoogle");
    if(!adsList){ return;}
    for(var i=0; i<adsList.length;i++){
        if(adsList[i].innerHTML.replace(/\s/g, "").length != 0){
            //AdBlock is not active, hence exit
            break;
        }
        //apply inline css to force display
        adsList[i].style.cssText = 'display:block !important';
        //modify html content of element
        adsList[i].innerHTML='<img src="imageurl/img_1.jpg" />';
    } 
}
</script>

Ссылка: Размещать альтернативный контент вместо AdBlock Censored Ads

Answer 5

Самым распространенным приемом является создание файла JavaScript с именем, которое обычно блокируется рекламодателями, например /ads/advert.js.Если файл заблокирован, вы знаете, что у посетителя включен блокировщик рекламы.

Файлы CSS обычно не блокируются списками блокировщика рекламы, поэтому такой подход был бы более безопасным.

Answer 6

Вы можете реализовать https://github.com/sitexw/FuckAdBlock, что очень хорошо и просто в использовании.

Answer 7

<script> // Run after all the page elements have loaded  window.onload = function(){ 
// This will take care of asynchronous Google ads
setTimeout(function() {     
  // We are targeting the first banner ad of AdSense
  var ad = document.querySelector("ins.adsbygoogle"); 
  // If the ad contains no innerHTML, ad blockers are at work
  if (ad && ad.innerHTML.replace(/\s/g, "").length == 0) {     
    // Since ad blocks hide ads using CSS too
    ad.style.cssText = 'display:block !important';         
    // You can put any text, image or even IFRAME tags here
    ad.innerHTML = '<img src="http://blog.liveurlifehere.com/wp-content/uploads/2015/01/adblock.jpg" width="300" height="250" />';      
  }      
}, 2000); // The ad blocker check is performed 2 seconds after the page load   }; </script>

Используйте этот код, вы можете установить изображение вместо Google Ads

Answer 8

Мой любимый подход - просто добавить класс 'ads' или 'ad' или что-то подобное во все большие и полезные блоки контента на моем сайте, тогда, когда люди с блокировщиком рекламы его просматривают, они ничего не видят,

Они вынуждены отключить свой рекламный блок для просмотра контента.

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

Вот текущий список правил блокировки из некоторых популярных расширений adblock.Просто выберите класс или идентификатор, который они блокируют (используйте инструменты разработчика для просмотра списка классов CSS)

Answer 9

Я не знаю, как работают блокировщики рекламы, но, например, Блокатор рекламы Chrome, который у меня есть , позволяет мне выбрать определенный элемент DOM, содержащий рекламу, которую нужно удалить: <div id="ad_holder"> ... ads ... </div>, и блокировщик удалит еекак-то.

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

AdBlock также поддерживает общедоступный список «плохих» серверов (http://www.doubleclick.com?) И, вероятно, будет блокировать запросы HTTP на контент с этих серверов.Это может быть сделано, если он интегрируется с Chrome, чтобы он мог определить какую-то политику содержимого - что загружается, а что нет.Этот случай вы можете обнаружить с помощью ранее описанного подхода.Если ваш клиент является поставщиком рекламы, я думаю, рано или поздно он окажется в черном списке:)

Блокировщик может только изменить CSS и скрыть весь div, но это можно легко обнаружить.