FAI DECOLLARE LA TUA WEB ANALYTICS. CON GOOGLE TAG MANAGER.

Le guide e i video tutorial gratuiti di Matteo Zambon, autore del libro "GTM per chi inizia"

Guida Avanzata: Tracciare AdBlock con Google Tag Manager

Guida Avanzata Tracciare AdBlock con Google Tag Manager

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 🙂

14 commenti su “Guida Avanzata: Tracciare AdBlock con Google Tag Manager

  1. 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!

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

  2. 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.

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

    • 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

    • Ciao Giulia, hai eliminato la stringa in rosso?

    • 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

    • 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

  3. 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?

    • 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!

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

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

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

    • 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!

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.

Schermata dashboard Club Tag Manager Italia

Entra GRATIS nel Club Tag Manager Italia!

Ho riaperto temporaneamente le iscrizioni al Club: il posto – l’unico posto – dove puoi accedere a TUTTI i miei materiali avanzati (ore e ore di roba).

In aggiunta, nel Club rispondo a tutte le tue domande in un gruppo di Facebook riservato ai membri!

Richiedi subito il tuo PASS GRATUITO di 60 giorni per provare senza impegno il Club Tag Manager Italia!