AdBlock Detector Widget

Welcher Webseitenbetreiber kennt es nicht. Man erstellt mit viel Liebe und auch Mühe eine Homepage, stellt diese Online und wartet auf Besucher. Man hat im Vorfeld eine Domain gemietet, womöglich noch mit eigenem Root-Server oder hat wie wir von ITNoobz eigene Hardware gekauft.

Nun kommen die ersten Besucher. Man freut sich und analysiert mit Tools die Besucherzahlen. Man freut sich nochmal, weil die Homepage erfolgreich ist und denkt darüber nach die Unkosten auszugleichen, welche der Server verursacht.

Also schaltet man Werbung auf seiner Homepage. Jedoch stellt man schnell fest, dass dabei so gut wie nichts rumkommt. Woran liegt das?

Fast jeder Internetnutzer in der heutigen Zeit verwendet einen Browser, der sich über Plugins erweitern lässt. Plugins, die unter anderem dazu benutzt werden um Werbung auszublenden. Das populärste hierbei wäre dann wohl Adblock Plus es gibt aber noch unzählige Andere.

Wie können sich nun Webseitenbetreiber verteidigen, um ihre Homepage und den Server zu finanzieren?

Das AdBlock Detector Widget dient dazu, einen aktivierten Werbeblocker aufzuspüren und dementsprechend eine Warnung / Bitte anzuzeigen. In dieser Anzeige, kann man den Besucher bitten, seinen Werbeblocker abzuschalten und damit die Webseite zu unterstützen.

Solltet der Besucher eurer Seite einen Werbeblocker aktiviert haben, bekommt er folgene Meldung zu sehen.

Deaktivieren Sie bitte Ihren Werbeblocker

Diese Webseite finanziert sich ausschließlich aus den Werbeeinnahmen. Alle Inhalte und Programme werden kostenlos zur Verfügung gestellt, der Betrieb des Servers ist jedoch nicht umsonst. Durch den Einsatz von Werbeblockern gefährden Sie den Fortbestand dieses Projektes.

Unterstützen Sie uns, indem Sie Javascript aktivieren und den Werbeblocker kurzzeitig, oder nur für diese Domain deaktivieren.

Wie deaktiviere ich meinen Werbeblocker?

Vielen Dank!

Funktionsweise

Der AdBlock Detector erkennt einen aktiven Werbeblocker mittels Javascript. Hierzu wird zuerst eine Variable "adblock" auf true gesetzt, in der Annahme, dass ein Werbeblocker aktiv ist. Dann wird versucht ein Sktipt mit einem auffälligen Namen zu laden. In unserem Fall "advertisement.js", welcher von jedem aktiven Werbeblocker als Werbung interpretiert wird. In diesem Skript wird die zuvor auf true gesetzte Variable auf false gesetzt, um zu Signalisieren, dass kein Werbeblocker aktiv ist, da ein solcher das Laden verhindert hätte und somit die Variable immernoch true wäre.

In einem späteren Script wird dann diese Variable überprüft. Sollte ein Werbeblocker das Nachladen des "advertisement.js" Scriptes geblockt haben, ist die Variable "adblock" immernoch true, wodurch signalisiert wird, dass ein Werbeblocker aktiv ist. Wurde das Nachladen nicht blockiert, ist die Variable auf false gesetzt, wodurch signalisiert wird, dass kein Werbeblocker aktiv ist.

Als letztes wird, insofern ein Werbeblocker aktiv war, mittels Ajax eine Text-Datei nachgeladen. Diese Textdatei wird dann in das Div-Element mit der ID "AdBlockDetectorWidget" eingefügt. So kann man diesen Werbeblocker Test auch auf verschiedenen Seiten verwenden und jederzeit den HTML-Text der Meldung verändern, ohne jede einzelne Seite abändern zu müssen.

Installation

  1. Die "AdBlockDetectorWidget.zip" im herunterladen und entpacken.
  2. Die Pfade in den <script>-Tags an eure Anforderungen anpassen.
  3. Den Pfad für die "AdBlockDetectorWidget_ajax.txt"-Datei in der "AdBlockDetectorWidget_ajax.js"-Datei für den Aufruf "AdBlockDetectorWidget.open();" anpassen.
  4. Den folgenden Quellcode in eure HTML-Seite einbinden:
<div id="AdBlockDetectorWidget"></div>
<script type="text/javascript" src="JS/AdBlockDetectorWidget_config.js"></script>
<script type="text/javascript" src="JS/advertisement.js"></script>
<script type="text/javascript" src="JS/AdBlockDetectorWidget_ajax.js"></script>

Copyright © 2013 Christian Pfarr Licensed under the GNU Affero General Public License (AGPL), Version 3

Quellcode

 

Kommentare

Könnt ihr vielleicht mal ein Video machen um zu zeigen wie man das gnaze installiert? Bin ein wenig überfordert. Benutze ein Wordpress CMS. Wie genau passe ich denn die <script>-Tags an?

Bild des Benutzers Christian

Hallo, in den script Tags musst du eigentlich nur den richtigen Pfad angeben, also das "src" Attribut um die JavaScript Dateien richtig zu verlinken.

Hallo Christian,

erst einmal vielen Dank für deine Mühen und das Script.
Darf ich dir einen Tipp geben? Verpack das Ding als WordPress-Plugin. Man wird dich dafür lieben ;-)

Viele Grüße,
Kai Thrun

Neuen Kommentar schreiben

Plain text

  • Keine HTML-Tags erlaubt.
  • Internet- und E-Mail-Adressen werden automatisch umgewandelt.
  • HTML - Zeilenumbrüche und Absätze werden automatisch erzeugt.
CAPTCHA
Dieses CHAPTA diehnt der Spam Bekämpfung