Jak wykryć adblocka? Wyświetlanie informacji w przypadku wykrycia

Większość blogów, stron internetowych wyświetla reklamy. Kiedy użytkownik ma zainstalowaną wtyczkę w swojej przeglądarce o nazwie "AdBlock" - nie są one wyświetlane. Pozbawia to zarobku właścicieli stron, czy blogów. Możemy wówczas wyświetlić na przykład takiemu użytkownikowi informację, zablokować jakąś część strony.

Oczywiście zablokowanie części strony, czy wyświetlenie jakiejś informacji to tylko przykład wykorzystania takiego kodu. Sposobów na jego wykorzystanie jest na prawdę wiele.

Jak działa AdBlock?

Wtyczka do przeglądarek o nazwie "AdBlock" posiada swoje filtry. Jeśli na stronie znajdzie zakazany link (element związany z reklamą zdefiniowaną w filtrze jako zakazana) to zablokuje go. Również zablokuje diva, paragraf - jeżeli w klasie odnajdzie wartość zdefiniowaną w filtrze jako zakazaną, na przykład adsbox.

1. JavaScript

Ten sposób polega na zdefiniowaniu bloku div o klasie "adsbox" i nadaniu mu jakiejś wysokości. Jeżeli użytkownik posiada zainstalowaną wtyczkę "AdBlock" to element ten nie zostanie wyświetlony, a poniższy kod JS dokona określonej akcji.

if( document.getElementByClassName('adsbox').offsetHeight == 0 ){
      document.write('Posiadasz zainstalowanego AdBlocka.');
   } else {
      document.write('Nie posiadasz zainstalowanego AdBlocka.');
   }
}

2. Wykorzystanie bilbioteki jQuery

Tutaj wykorzystamy bibliotekę jQuery. Trzeba ją mieć załączoną do strony. Poniższy kod, podobnie jak w pierwszym przykładzie, wymaga utworzenia bloku div o klasie "adsbox" i nadania mu jakiejś wysokości. Później sprawdza jego wysokość, jeśli wynosi 0 (czyli AdBlock go zablokował) to pokazuje blok div o klasie "reklama-info".

(function () {
  window.setTimeout(function () {
    if ($('.adsbox').height() === 0 || $('.adsbox').filter(':visible') === 0) {
      $('.reklama-info').show();
    }
  }, 1000);
})();

Kod HTML:

<div class="adsbox">Miejsce na reklamę</div>
<div class="reklama-info" style="visibility:hidden;">Informacja</div>

Data publikacji: Niedziela, 18.01.2015. Tagi: przeglądarki internetowe, adblock, jquery, javascript. Źródło obrazka porady: Film ze strony adblockplus.org.