Javascript pour détecter la présence de comportements associés au blocage des publicités lors de la diffusion d'une page.
Le JavaScript (adblockDetector.js) a été testé pour détecter les comportements associés au blocage des publicités dans les navigateurs Web suivants :
Pour ce faire, le script crée un ensemble de DIV susceptibles d'être masqués par les outils de blocage des publicités basés sur le navigateur.
Tactiques supplémentaires qui ne sont pas encore incluses dans ce script :
Téléchargez le script de détection souhaité et ajoutez-le à votre site Web. Il existe différentes manières d'inclure JavaScript dans HTML.
| Nom du script | Description |
|---|---|
| adblockDetector.js | Script de détection Adblocker sans module Google Analytics |
| adblockDetectorWithGA.js | Script de détection Adblocker avec module Google Analytics |
Avec AdBlockDetectionWithGA.js, il vous est demandé de mentionner votre identifiant de suivi GA dans le script de la ligne n° 82. Lorsque vous faites référence à ce script, il suit certains événements concernant AdBlock sur le navigateur de l'utilisateur. Vous pouvez afficher les détails dans le tableau de bord Google Analytics. Voici comment vérifier si l'utilisateur utilise un adblock ou non.
Tout d’abord, nous vous suggérons de créer un identifiant GA-Tracking différent afin qu’il n’interfère pas avec vos pages vues. Suivez les étapes ci-dessous pour GA sur l'utilisation d'Adblock.
Malheureusement, nous n'avons pas encore trouvé comment le mettre sur le tableau de bord. Ainsi, la prochaine fois que vous accéderez à GA, vous pourrez accéder à l'Explorateur d'utilisateurs -> cliquer sur Ajouter un nouveau segment. Et vous retrouverez les segments que vous avez créés précédemment (c'est-à-dire un pour les utilisateurs détectés par Adblock et un pour les utilisateurs non détectés par Adblock.). Vous pouvez les sélectionner et cliquer sur Appliquer pour voir les données rapportées.
Cela devrait ressembler à l’image ci-dessous.
Il s'agit de la méthode d'inclusion recommandée. Les fonctions contenues dans le script de détection choisi doivent être incluses directement dans le HTML du frame parent.
Pour ce faire, en encapsulant le contenu du code sélectionné dans des balises de script dans le code HTML fourni.
Il est possible d'héberger le code sélectionné sur votre serveur web sous forme de fichier indépendant, et de référencer ce fichier à partir du HTML livré.
Si vous utilisez un fichier de script externe, il peut être bloqué par des bloqueurs de publicités. L'utilisation d'un nom différent pour le fichier réduira la probabilité qu'il soit bloqué par des filtres génériques.
Il est possible d'intégrer les fonctions du code sélectionné dans une bibliothèque de scripts existante, hébergée sous forme de fichier de script externe. Cela peut entraîner une réduction des fonctionnalités du site pour les visiteurs utilisant des bloqueurs de publicités qui tentent d'éviter la détection, si les bloqueurs de publicités bloquent l'intégralité du fichier de script externe.
@prop drapeaux
| Option | Taper | Description |
|---|---|---|
| déboguer | Booléen | Indique qu'une sortie de débogage supplémentaire doit être imprimée sur la console |
| trouvé | Chaîne (@fonction) | Fonction à déclencher si un bloc publicitaire est détecté |
| introuvable | Chaîne (@fonction) | Fonction à déclencher si adblock n'est pas détecté. Notez que cela se déclenchera chaque fois qu'adblock n'est pas détecté et ne devrait fournir une entrée sur l'action entreprise qu'après la détection de « terminé ». |
| complet | Chaîne (@fonction) | Fonction à déclencher une fois les tests terminés. |
Le résultat du test (booléen) est inclus en tant que paramètre pour l'exemple de rappel :
window . adblockDetector . init (
{
found : function ( ) { ... } ,
notFound : function ( ) { ... }
}
) ;Ajoutez le code ci-dessous dans la page HTML.
< script src = "./adblockDetector.js" > < / script >
< script >
// Configure the adblock detector
( function ( ) {
var enabledEl = document . getElementById ( 'adb-enabled' ) ;
var disabledEl = document . getElementById ( 'adb-not-enabled' ) ;
function adBlockDetected ( ) {
enabledEl . style . display = 'block' ;
disabledEl . style . display = 'none' ;
}
function adBlockNotDetected ( ) {
disabledEl . style . display = 'block' ;
enabledEl . style . display = 'none' ;
}
if ( typeof window . adblockDetector === 'undefined' ) {
adBlockDetected ( ) ;
} else {
window . adblockDetector . init (
{
debug : true ,
found : function ( ) {
adBlockDetected ( ) ;
} ,
notFound : function ( ) {
adBlockNotDetected ( ) ;
}
}
) ;
}
} ( ) ) ;
< / script >Ajoutez le code ci-dessous dans le corps de la page HTML
< div class =" center " >
< h5 class =" bg-success " id =" adb-not-enabled " style =" display: none; " > AdBlock is disabled </ h5 >
< h5 class =" bg-danger " id =" adb-enabled " style =" display: none; " > AdBlock is enabled </ h5 >
</ div >Fourchette-le ! Créez votre branche de fonctionnalités : git checkout -b my-new-feature Validez vos modifications : git commit -am 'Add some feature' Push vers la branche : git push origin my-new-feature Soumettez une pull request
