Script per invitare a disattivare AdBlock e AdBlock Plus.

Come mostrare un messaggio che inviita i navigatori a disabilitare AdBlock e AdBlock Plus per poter usufruire di tutti i contenuti del sito.

Le pubblicità più invasive sono quelle che aprono delle finestre popup a ogni piè sospinto e ad ogni interazione del lettore con i contenuti del sito. È proprio per questa ragione che sono nate delle estensioni per i più importanti browser che consentono di navigare senza visualizzare messaggi pubblicitari. AdBlock e AdBlock Plus sono addons disponibili per i principali browser che hanno appunto questa funzione. Le numerosissime installazioni di queste estensioni sembra stiano però penalizzando anche quei siti che hanno solo due o tre banner ben integrati nel contenuto visto che i navigatori una volta che hanno attivato tale estensioni poi si dimenticano di disattivarle durante la navigazione al di fuori di quei siti profondamente invasivi. 

In  un commento nella pagina Facebook di questo blog ho ricevuto la richiesta di come si possano creare delle contromisure per Ad Block e Ad Block Plus. Secondo me a prima vista i benefici potrebbero essere molto modesti perché chi non ama la pubblicità non è che poi clicca sopra ai banner e d'altra parte invitare i lettori a disattivare Ad Block potrebbe avere il risultato che poi questi chiudano la pagina e semplicemente non tornino più nel sito.

C'è inoltre l'altro tema della liceità e della conformità al Regolamento del circuito pubblicitario che utilizziamo. Premetto che non sono un esperto di questi argomenti ma facendo delle rapide ricerche ho trovato delle interessanti discussioni sul Forum Adsense in italiano e sul Forum Adsense in inglese con risultati contraddittori. Si tratta sempre di thread tra utenti e non tra dipendenti Google e quindi devono essere presi per quello che sono ma mentre nel forum in inglese un messaggio di disattivazione viene considerato una "bad idea" in quello in italiano sono decisamente più possibilisti.

Non è mio compito addentrarmi sui temi regolamentari ma mi limiterò a postare il codice da utilizzare con l'avvertenza di eventualmente approfondire la questione della policy dei programmi di affiliazione del vostro sito. Dopo l'installazione dello script se un navigatore aprirà una pagina del sito con un browser che abbia Ad Block o Ad Block Plus installato visualizzerà questo messaggio 

che potrà essere modificato a seconda delle esigenze. Ho anche creato una pagina di demo

che mostrerà quella finestra solo nel caso in cui la apriate con un browser che abbia AdBlock o AdBlock Plus attivate. In un blog su Blogger per l'installazione si va su Layout > Aggiungi un gadget > Base > HTML / Javascript e, in Sezioni del sito, si incolla questo codice

<script>(function(w,u){var d=w.document,z=typeof u;function g207(){function c(c,i){var e=d.createElement('i'),b=d.body,s=b.style,l=b.childNodes.length;if(typeof i!=z){e.setAttribute('id',i);s.margin=s.padding=0;s.height='100%';l=Math.floor(Math.random()*l)+1}e.innerHTML=c;b.insertBefore(e,b.childNodes[l-1])}function g(i,t){return !t?d.getElementById(i):d.getElementsByTagName(t)};function f(v){if(!g('g207')){c('<p><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmB63tR3elztvC-w6eBA39HxjFAD8eApglXOLjHFFAP3iW5zQJ-KPyhd9X-nRaRY9fW_739T-cUJY0dxIZKrs_G6jOxsc-hTkjDh1BiPPbkt-0ujV3OSkVvV6anN0D32soLtn2yySM31T9/s371/dark_banner-adbp.png"><br/>Per visualizzare il contenuto devi disattivare Ad Block<br/>Ad Block attivata non permette la completa visualizzazione del sito<br/>Per favore disattiva Ad Block per continuare a navigare su questo blog<br/>Please disable Ad Block or Ad Block Plus Addons!<br/>Potresti perdere dei messaggi pubblicitari utili ai tuoi interessi<br/>Con Ad Block attivata non potrai fruire di alcuni contenuti del sito</p>','g207')}};(function(){var a=['Adrectangle','PageLeaderAd','ad-column','advertising2','divAdBox','mochila-column-right-ad-300x250-1','searchAdSenseBox','ad','ads','adsense'],l=a.length,i,s='',e;for(i=0;i<l;i++){if(!g(a[i])){s+='<a id="'+a[i]+'"></a>'}}c(s);l=a.length;for(i=0;i<l;i++){e=g(a[i]);if(e.offsetParent==null||(w.getComputedStyle?d.defaultView.getComputedStyle(e,null).getPropertyValue('display'):e.currentStyle.display)=='none'){return f('#'+a[i])}}}());(function(){var t=g(0,'img'),a=['/adaffiliate_','/adops/ad','/adsales/ad','/adsby.','/adtest.','/ajax/ads/ad','/controller/ads/ad','/pageads/ad','/weather/ads/ad','-728x90-'],i;if(typeof t[0]!=z&&typeof t[0].src!=z){i=new Image();i.onload=function(){this.onload=z;this.onerror=function(){f(this.src)};this.src=t[0].src+'#'+a.join('')};i.src=t[0].src}}());(function(){var o={'http://pagead2.googlesyndication.com/pagead/show_ads.js':'google_ad_client','http://js.adscale.de/getads.js':'adscale_slot_id','http://get.mirando.de/mirando.js':'adPlaceId'},S=g(0,'script'),l=S.length-1,n,r,i,v,s;d.write=null;for(i=l;i>=0;--i){s=S[i];if(typeof o[s.src]!=z){n=d.createElement('script');n.type='text/javascript';n.src=s.src;v=o[s.src];w[v]=u;r=S[0];n.onload=n.onreadystatechange=function(){if(typeof w[v]==z&&(!this.readyState||this.readyState==="loaded"||this.readyState==="complete")){n.onload=n.onreadystatechange=null;r.parentNode.removeChild(n);w[v]=null}};r.parentNode.insertBefore(n,r);setTimeout(function(){if(w[v]!==null){f(n.src)}},2000);break}}}())}if(d.addEventListener){w.addEventListener('load',g207,false)}else{w.attachEvent('onload',g207)}})(window);</script>
<style type="text/css">
/* Stile invito disattivazione AdBlock */
 #g207{
position:fixed !important;
position:absolute; /* Posizione */
top:0;
top:expression((t=document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop)+"px");
left:0;
width:100%; /* Larghezza */
 height:100%; /* Altezza */
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj03rnbm869MMoCptqko8qVh7TauVi5pWj_qMtNvFKqSqmj0C3EEnpPweQIqj0-HgntydkrDTVCZL3l-ubkcuglcb5MVnu0fs-WvpePzDpva1z6t614tVe_rJbI8ZgtX826qNqBXs7zzSOC/s640/cielo-stellato.png) right center !important; /* Immagine di sfondo */
opacity:0.85; /* Opacità */
filter:alpha(opacity=85); /* Filtro Opacità */
display:block
}
#g207 p{
opacity:1; /* Opacità testo */
filter:none;
font:bold 24px Georgia, sans-serif; /* Famiglia font */
line-height:36px; /* Altezza riga */
color:#fcc;
text-align:center; /* Allineamento del testo */
 text-transform:uppercase; /* TUTTE MAIUSCOLE */
 font-style:italic; /* Corsivo */
margin:10% 0; /* Margine del testo */}
#g207 p a,#g207 p i{
font-size:18px; /* Dimensione caratteri */
}
#g207 ~ *{
display:none
}
</style>

Si salva e il suo posizionamento nel layout sarà irrilevante. Il testo colorato di blu potrà essere modificato a piacere ricordando che il tag <br/> è un salto di riga. Le due immagini usate hanno l'URL colorato di rosso e gli altri parametri modificabili  hanno a lato un commento esplicativo.

Fonte | Aizum Blog -