Gli AdBlock sono delle estensioni e plugin per i browser che impediscono il caricamento degli annunci pubblicitari, popup pubblicitari e altri tipi di pubblicità presenti sui siti web. L'esistenza dell'AdBlocking, sia per dispositivi desktop, tablet e smartphone, è un fenomeno in forte crescita che non impedisce solo agli utenti di vedere gli annunci e di essere tracciati ma non permette ai rispettivi proprietari dei siti web di poter monetizzare. Infatti sono numerosi gli utenti internet che si avvalgono di software AdBlock per bloccare la visualizzazione dei banner pubblicitari presenti sui siti che visitano a danno dei proprietari dei siti web che si affidano alla pubblicità come fonte primaria di guadagno. Per risolvere il problema non esiste, ad oggi, una soluzione e per questo molti proprietari di siti web hanno iniziato a convivere con questa perdita mentre molti altri hanno adottato tecniche aggressive come bloccare l'accesso al sito per gli utenti con AdBlock attivo costretti a disattivarlo per poter visualizzare i contenuti. Il più delle volte questo sistema ha effetti negativi infatti non fa altro che allontanare, anche per sempre, il visitatore.
È possibile, però, usare una tecnica meno invasiva con il quale si può, gentilmente, invitare il visitatore del sito a disattivare l'AdBlock.
Con questa tecnica, basata su codice JavaScript, è possibile identificare gli utenti che utilizzano un AdBlock e quindi, come detto precedentemente, invitarli, tramite la visualizzazione di un messaggio sotto forma di banner, a disattivare l'estensione o il plugin.
Questa tecnica consiste nella creazione di un finto script pubblicitario, nella creazione di un codice che verifichi se il finto script pubblicitario verrà caricato o no ed infine nella crezione di un messaggio che invita gli utenti, con AdBlock attivo, a disattivarlo e di creare un eccezione per il sito aggiungendolo nella whitelist.
Creazione finto script pubblicitario
Con un editor di testo come Blocco note o Notepad++ (per il S.O. Windows) oppure TextEdit o BBEdit (per il S.O. MacOs) creare un file script chiamato, ad esempio, antiadblock.js dove al suo interno inserire il seguente codice JavaScript:
var e=document.createElement('div');
e.id='test-AdBlock';
e.style.display='none';
document.body.appendChild(e);
Fare molta attenzione all'estensione quando verrà salvato il file perchè per il suo funzionamento l'estensione deve essere .js
In alternativa è possibile scaricare il file, già pronto, dal seguente link:
Download file script
Download
Il file .js creato o scaricato dovrà essere posizionato nella directory principale, o dentro una cartella, del sito web.
Script di verifica
Per verificare se il visitatore del sito sta utilizzando un software AdBlock è necessario inserire nel codice sorgente HTML del sito web, appena sopra il tag </body>, il seguente codice JavaScript:
<script src="/antiadblock.js" type="text/javascript"></script> <script type="text/javascript"> if(document.getElementById('test-Adblock')){ alert('Blocking Ads: No'); } else { alert('Blocking Ads: Yes'); } </script>
Nel campo src= sostituire "/antiadblock.js" con il percorso esatto del file antiadblock.js
Lo scopo di questo script è di controllare se il div nascosto creato in "antiadblock.js" esiste o meno. Se il visitatore sta utilizzando un software AdBlock il file antiadblock.js verrà bloccato e di conseguenza il codice di verifica ne rileverà la presenza.
Creazione messaggio
Se il visitatore sta utilizzando un AdBlock verrà invitato a disattivarlo tramite un messaggio, sotto forma di banner, che può essere posizionato in una qualsiasi posizione del sito oppure farlo apparire nello stesso posto in cui è presente il banner pubblicitario, ad esempio Adsense, bloccato dall' AdBlock.
Nelle pagine in cui sono presenti i banner pubblicitari inserire, nella posizione voluta, il seguente codice:
<div id="message">Ciao visitatore, è stato rilevato un software adblocking che blocca la pubblicità .<br />
Questo sito si sostiene solo grazie ad un paio di annunci pubblicitari non invasivi.<br />
Per cortesia disattiva l'adblocking e inserisci un eccezione per il mio sito aggiungendolo anche nella whitelist.</div>
<script src="/antiadblock.js" type="text/javascript"></script>
<script type="text/javascript">
if(!document.getElementById('test-Adblock')){
document.getElementById('no-ads').style.display='block';
}
</script>
Il testo in verde può essere modificato a piacimento e nel campo src= sostituire "/antiadblock.js" con il percorso esatto del file antiadblock.js
La proprietà CSS per id="message" è la seguente (modificare a piacimento):
#message {
width: 100%;
height: auto;
display: none;
margin-bottom: 10px;
padding: 20px 10px;
background: #D30000;
text-align: center;
font-weight: bold;
color: #fff;
border-radius: 5px;
}
Con AdBlock attivo il risultato finale sarà :
Se il messaggio dovrà apparire al posto del banner pubblicitario bloccato è necessario inserire il codice dopo o prima lo script pubblicitario.
Esempio:
<!-- Inizio codice Adsense -->
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <ins class="adsbygoogle"
style="display:block; text-align:center;"
***************
***************
***************</ins>
<script>
(adsbygoogle = window.****************
</script>
<!-- Fine codice Adsense -->
<div id="message">Ciao visitatore, è stato rilevato un software adblocking che blocca la pubblicità .<br />
Questo sito si sostiene solo grazie ad un paio di annunci pubblicitari non invasivi.<br />
Per cortesia disattiva l'adblocking e inserisci un eccezione per il mio sito aggiungendolo anche nella whitelist.</div>
<script src="/antiadblock.js" type="text/javascript"></script>
<script type="text/javascript">
if(!document.getElementById('test-Adblock')){
document.getElementById('no-ads').style.display='block';
}
</script>
