Ti sei mai chiesto se puoi tracciare gli utenti che hanno AdBlock installato? Perchè dovresti farlo (anche se non hai AdSense)?
Ti lascio due valide ragioni:
1- Hai mai provato a navigare il tuo sito con AdBlock? Probabilmente potrebbero esserci degli elementi bloccati.
2- Potresti escludere dal remarketing gli utenti che usano quell’estensione.

L’idea è questa. Usiamo una variabile nel DataLayer che indica se AdBlock è attivo o meno. Il valore della variabile lo passiamo ad una dimensione personalizzata su Google Analytics attraverso un evento. Il tutto senza toccare una riga di codice del sito.

Sei pronto? Iniziamo!

Step 1 – Creiamo il Tag HTML Personalizzato

Per prima cosa dobbiamo creare un codice personalizzato HTML. Nel dettaglio inseriremo un elemento DIV che farà da “esca” all’AdBlock e un codice javascript che si baserà su jQuery che verifica se il DIV verrà nascosto dall’AdBlock. Il risultato di questa operazione lo “pusheremo” (aggiungeremo) al DataLayer attraverso un evento personalizzato. Andiamo nella sezione Tag di Google Tag Manager.

Scegli prodotto: “Tag HTML personalizzato
In Configura Tag incolla il seguente codice. Se usi già la libreria di jQuery ti basta eliminare la riga di codice rossa.

[update] ► Se notate dei problemi di conflitto con la variabile $ provate a cambiate la string $ con jQuery

<div id="bottomAd" style="font-size: 2px;">&nbsp;</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

<script>
    
$(document).ready( function() {
  window.setTimeout( function() 
  {
    var bottomad = $('#bottomAd');
    
    if (bottomad.length == 1) 
    {
      if (bottomad.height() == 0) 
      {
        dataLayer.push({'event': 'ir.adBlock', 'adBlockDetected': 1 });
      } 
      else 
      {
        dataLayer.push({'event': 'ir.adBlock', 'adBlockDetected': 0 });
      }
    }      
  }, 1);
});

</script>

Attiva su: Tutte le pagine

Dovresti avere quindi un Tag di questo tipo:

google tag manager tracciare adblock - tag html personalizzato

Step 2 – Verifica il codice con Debug e Preview

Metti il tuo contenitore in Debug e verifica che venga scatenato l’evento e che nel DataLayer ci sia il valore della variabile adBlockDetected.

I valori possono essere:

  • adBlockDetected = 0 allora non c’è AdBlock attivato
  • adBlockDetected = 1 allora AdBlock è attivato

google tag manager tracciare adblock - debug preview

Step 3 – Creiamo la Variabile Livello di Dati

Prossimo passo è quello di catturare il valore di adBlockDetected nel DataLayer e gestirlo in una variabile:

Variabile: Variabile di Livello Dati
Nome variabile livello dati: adBlockDetected Imposta valore predefinito: 0

Dovresti avere una configurazione di questo tipo:

google tag manager tracciare adblock - variabile datalayer

Step 4 – Creiamo l’attivatore

Associamo l’evento che abbiamo creato nel push ad un Attivatore di tipo personalizzato:

Scegli Evento: Evento personalizzato
Attiva su: ir.adBlock

google tag manager tracciare adblock - evento personalizzato

Mancano pochi passaggi 🙂

Step 5 – Creiamo la dimensione personalizzata su Google Analytics

Per poter gestire e creare report personalizzati la cosa che conviene fare è creare una dimensione personalizzata su Google Analytics:

Amministrazione -> Proprietà -> Definizioni Personalizzate -> Dimensioni personalizzate

Click pulsante -> Nuova Dimensione Personalizzata

Nome: AdBlock
Ambito: Utente
Attivo: Check si

Quando salvi fai attenzione al numero index associato alla dimensione personalizzata (nel mio caso è 7).

google tag manager tracciare adblock - dimensione personalizzata

Step 6 – Creiamo l’evento su Google Analytics

Abbiamo tutto pronto, non ci resta che creare un evento su Google Analytics attraverso il Tag Analytics in Google Tag Manager. L’evento prenderà il valore della variabile e verrà attivato all’evento personalizzato.

Titolo Tag: GA – Event – AdBlock
Scegli prodotto: Universal Analytics
Nella sezione Configura Tag
Codice di monitoraggio: la costante gaID
Tipo di monitoraggio: Evento
Categoria: AdBlock
Azione: {{adBlockDetected}}
Etichetta: {{Page Path}}  (non è obbligatorio)
Hit da non interazione: true
Ulteriori impostazioni -> Dimensioni personalizzate -> Indice: 7 (valore dell’indice della dimensione su Google Analytics)
Ulteriori impostazioni -> Dimensioni personalizzate -> valore dimensione: {{adBlockDetected}}
Attiva su -> Altro -> ir.AdBlock

google tag manager tracciare adblock - tag analytics

Non ti resta che eseguire il debug e pubblicare!

Ti consiglio sempre di verificare con il debug e se trovi gli hit degli eventi sul rapporto in tempo reale in Google Analytics allora il gioco è fatto!

google tag manager tracciare adblock - tag analytics2

Ora riesci ad avere un’informazione in più, ovvero capire quanti utenti utilizzano AdBlock.

Link Utili:

A presto e buon Tag!

PS: Ti sarebbe più utile una video guida? Lasciami un commento, in caso positivo mi attiverò per farlo 🙂

  • Reply

    Alberto

    04 07 2016

    Ciao, non mi è molto chiaro il passo 6: parli di crearlo dentro Analytics, ma non trovo la maschera adatta. La grafica dello schreenshot mi sembra più quella di TagManager. Puoi darmi una mano? grazie!

    • Matteo Zambon

      04 07 2016

      Ciao Alberto, hai ragione ho aggiornato la spiegazione esplicitando che si tratta del Tag Analytics di GTM.

  • Reply

    Giulia

    16 06 2016

    Ottimo tutorial. A me però non va lo step 2. Eh si che basa copia-incollare la porzione di codice e salvare… 🙁 Ho lanciato il debug ma niente ir.abBlock sul data layer.
    Magari un video tutorial mi farebbe capire dove sbaglio.

    • Matteo Zambon

      16 06 2016

      Ciao Giulia, un’altra richiesta e faccio il video 🙂
      Occhio, verifica che il copia incolla che fai sia corretto!

    • Giulia

      20 06 2016

      Ciao Matteo,
      il problema sta nella stringa .
      Se non metto la stringa, il datalayer non funziona . Se metto la stringa, va in conflitto con il nostro jquery.
      La libreria Jquery che noi usiamo è la versione 1.11. Hai qualcosa di compatibile?
      Fammi sapere.
      Grazie

    • Matteo Zambon

      20 06 2016

      Ciao Giulia, hai eliminato la stringa in rosso?

    • Giulia

      20 06 2016

      Si all’inizio ho fatto così, ma il debug non va, non riconosce ir.abBlock nel datalayer.
      Se invece lascio la stringa, il datalayer lo riconosce ma questo va in conflitto con la versione jQuery usata dal template del nostro sito, che è 1.11.
      Grazie,
      Giulia

    • Matteo Zambon

      20 06 2016

      Prova a fare così:
      – Togli il codice in rosso
      – Nella selezione dell’attivatore del Tag HMTL crea un nuovo attivatore con queste proprietà:
      ► scegli evento : Visualizzaizioe di Pagina
      ► configura attivatore : Finestra caricata
      ► attiva su: tutte le visualizzazioni

  • Reply

    alessandra rossi

    15 06 2016

    Molto stimolante, oltre che utile. Tempo fa scoprii che Adblock bloccava le immagini del nostro sito di tutorial, argh! Contattato subito l’amministratore delle liste ed il problema è cessato. Ma con le campagne su Google è un macello. Non tanto per noi che abbiamo deciso per altri canali al momento, ma per un sacco di aziende nostre clienti.
    Quindi divulgo volentieri e.. SI, ritengo che un video servirebbe.
    Se vuoi farne uno molto approfondito, hai pensato di venderlo?
    In questo caso hai considerato di pubblicarne anche una versione “stringata” gratuita?

    • Matteo Zambon

      15 06 2016

      Ciao Alessandra, si un consiglio che do è testare sempre i siti con AdBlock per vedere se viene bloccato qualcosa per errore.
      Tengo presente anche la tua richiesta, altre 2 e farò il video tutorial di questa guida.

      Per il discorso vendita molto approfondito direi di no, perché qui in realtà ti sto dando già il pesce cucinato. Mentre nel video corso “AL COMANDO” ti insegno come pescare 🙂
      Poi se hai esigenze particolari fammi sapere che al limite ci mettiamo d’accordo.

      A presto!

  • Reply

    Irene Tondi

    13 06 2016

    Grazie per questa guida, davvero utile 🙂 Mi piacerebbe facessi anche una video guida passo passo!

    • Matteo Zambon

      13 06 2016

      Ciao Irene grazie del feedback! Altre 3 richieste e prometto che la farò 🙂

  • Reply

    Roberto Santoli

    10 06 2016

    Ottima guida. Come da tua domanda finale rispondo: “sì, mi piacerebbe facessi anche una video guida passo passo” 😉

    • Matteo Zambon

      10 06 2016

      Grazie del feedback Roberto 🙂
      Se ricevo minimo 5 richieste (qui sui commenti) la farò!

Hai ancora qualche dubbio?
Chiedi pure qui sotto, sarò pronto a risponderti!

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *