tracciare i clicks con google tag manager

Come tracciare i click sulle email e i numeri di telefono e i download del tuo sito web [AGGIORNATO]

19 aprile 2017
in Analytics, SEO, Tecniche

[Aggiornato con videotutorial]

 

Ti sei mai chiesto come tracciare i click che gli utenti del tuo sito web fanno sulle email e sui siti web?

Ti sei chiesto come farlo nel modo più veloce possibile e con uno strumento affidabile?

Sappi che puoi tracciare i click su tante entità del tuo sito web, quali:

  • I click sui download di file (ad es.: il curriculum in .PDF che inserisci nel sito o l’ebook che hai messo a disposizione gratutia di tutti)
  • I click sulle email (nel formato mailto:info@iltuosito.com)
  • I click sui numeri di telefono (nel formato tel:+390292384798237897243)
  • I click sui link ai tuoi profili sociali
  • Tutti gli altri click che ti vengono in mente 🙂

La risposta sta in Google Tag Manager, il servizio (o software) che ti permette di tracciare i click che avvengono durante la navigazione nel tuo sito web. Come? Tramite eventi di Analytics.

Ok, sto correndo troppo. Andiamo per gradi.

Ti racconto innanzitutto una breve storia qui sotto…

Come tracciare i links? Il ‘balzo in avanti’ di Universal Analytics

In passato, se volevi tracciare questo tipo di click era necessario modificare il codice del tuo sito, quindi ti dovevi affidare allo sviluppatore di turno oppure applicare queste modifiche di codice tu stesso, a mano.

Se, per esempio, avessi voluto generare  un codice per tracciare i click sul tuo account Twitter, avrei scritto un codice del genere:

<a class=”il-mio-account-twitter” href=”https://twitter.com/faustogiungato” onclick=”recordOutboundLink(this, ‘Outbound Links’, ‘Twitter’, ‘Navigazione nel mio sito’);return false;”>twitter</a>

Altro esempio? Se avessi volute tracciare i click a un sito a cui ero affiliate, potevo usare un codice del genere:


<a href="https://www.google.com" onclick="_gaq.push([‘_trackEvent’, ‘link-a-sito-esterno-affiliato, ‘click’, ‘SitoEsterno]);">SitoEsterno.com</a>

Ok, non è più così. Questo modo di monitorare è superato.

Con Google Tag Manager puoi superare questo approccio “manuale” e gestire tutti questi tracking in una consolle di semplice utilizzo.

 

Che cos’è Google Tag Manager?

logo di google tag manager

Da marketer consumato quale tu sei, so che già sai di cosa stiamo parlando; per cui ti dirò solo perchè Google Tag Manager è comodo: con un unico codice (da inserire appena dopo il tag <body> delle pagine del tuo sito) puoi tracciare e monitorare tutto quello che vuoi.

Se invece non conosci Google Tag Manager, te lo spiegherò in un prossimo tutorial, ma creare un account è velocissimo (basta avere Gmail e poco altro).

 

1° step: Configura Google Tag Manager

Quindi, come già detto, non devi far altro che inserire appena dopo il tag <body> un codice del genere:

<!-- Google Tag Manager -->
<noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-P8PFD9"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-P8PFD9');</script>
<!-- End Google Tag Manager -->

 

2° step: Crea un Tag “Listener clic link”

Cosa?

Google Tag Manager ragiona per “Tag”: nella consolle di Tag Manager, tu inserisci un’istruzione e  il tuo sito risponde a quell’istruzione senza la necessità di aggiungere una riga di codice.
In questo caso, devi aggiungere un tag che serve a Google Analytics a “sentire” il click.

Come fare?

Guarda pure l’obrobrio che ho preparato qui sotto con il vecchissimo Fireworks 8 di cui sono licenziatario…

google tag manager traccia i tuoi click

  1. Nome Tag: “Listener clic link“
  2. Tipo di Tag: “Listener clic link“
  3. Regole di attivazione: clicca su “Aggiungi“ e poi su “Tutte le Pagine”
  4. Clicca in basso su “Salva”

Una volta salvato questo tag, potrai notare una cosa interessante sul tuo menu di sinistra e cioè che:

  1. Frai tuoi tag c’è quello che hai appena creato (“Listener click link”);
  2. Fra le regole hai “Tutte le pagine”.

google tag manager tags e regole riutilizzabili
La comodità di questa cosa è che questo tag e questa regola potrai riutilizzarli in altri contesti senza ri-crearli da zero.

 

 

3° step:  Crea un tag per tracciare i click sulle email del tuo sito

Questo terzo passaggio lascia spazio alla tua fantasia, perchè puoi decidere di aggiungere dei tag per singoli links di varia natura, come ad esempio:

  • indirizzi email
  • link di download di PDF
  • link a canali sociali che hai inserito nel footer del tuo sito
  • Ecc.

Nel caso che ti sto illustrando, procederemo a inserire un tag che tracci il click alla mia email (info@faustogiungato.com).

crea-tag-mail-click-3

  1. Nome tag: ”Click alla email”
  2. Tipo di tag: ”Universal Analytics”
  3. ID monitoraggio: (inserisci il numero del tuo ID di monitoraggio che trovi in Google Analytics in Amministrazione >> “Proprietà” >> “Informazioni sul monitoraggio” >> “Codice di monitoraggio”)
  4. Tipo di monitoraggio: “Evento”
  5. Infine, all’interno dei parametri del monitoraggio eventi, puoi inserire:
    • Categoria: “Click alla email” (o il nome che vuoi tu);
    • Azione: {{url}} (questo codice tra le due parentesi graffe rappresenta una “macro” di Google Tag Manager)
    • Etichetta: {{element url}}
  6. Attenzione! Rimane ancora un’altra cosa da fare: in alto a destra devi associare questo tag ad una regola. Ma quale regola? In alto a destra, affianco a “Regole di attivazione” clicca il pulsante “Aggiungi” (vedi figura qui sotto)

crea nuova regola in google tag manager-5a

 

A questo punto ti si aprirà una pop-up, in cui dovrai seguire i seguenti passaggi:

crea una nuova regola in Google Tag Manager

  1. Scegli la combo “Crea una nuova regola”
  2. Nome regole: “Mailto Click” (o il nome che vuoi tu)
  3. Condizioni: {{event}} uguale a gtm.linkClick

(poi premi il pulsante +)

  1. {{element url}} contiene mailto
  2. Clicca il pulsante “Salva”
  3. Ti si chiude il popup. Ma ricordati di premere “Salva” in basso nel tag; in pratica devi premere “salva” due volte in serie: prima nella popup e poi (quando si chiude la popup) sulla schermata del Tag che abbiamo chiamato ”Click alla email”.

Con questa regola, verranno tracciati tutti i click a tutti gli elementi che contengono “mailto”, come abbiamo appena visto. Cosa vuol dire? Che verranno tracciati i click ad ogni email presente nel tuo sito.

Se vuoi specificare una mail precisa, il modo più rapido ed indolore è modificare leggermente il punto 4 appena visto con “{{element url}} contiene mailto:latuaemail@latuaemail.com”.

 

4° step: Crea una versione dei tuoi tags

Passo fondamentale.

Tutte queste modifiche non sono attive, se non fai questo passaggio:

  • Sulla sinistra, scegli “Bozza contenitore” >> “Panoramica”
  • Clicca poi in altro a destra “Crea Versione”
  • E poi “Pubblica”.

Solo ora i tuoi tags sono attivi anche nel sito web.

 

 

5° step: Debugga tutto

Ma come? Il debug dopo la pubblicazione?

I developer avranno dei brividi freddi lungo la schiena, ma – niente paura – ho inserito questo step dopo la pubblicazione solo per ragioni di scrittura del post 🙂
E comunque anche se fate la pubblicazione prima del debug, state certi che il sito non si spacca.

Per debuggare, segui questi passi:

  • Nella colonna sinistra “Versioni” clicca sull’ultima versione che hai creato del tuo profilo di tag (la mia versione nell’esempio è la numero 7).

google-tag-manager-debug-6a

  • Clicca poi in alto a destra il bottone blu “Anteprima”: ti si aprirà una popup in cui devi cliccare “Debug”.

google-tag-manager-debug-6b

  • Ti si aprirà un’altra finestra simile a quella qui in basso: clicca sul nome del dominio che stai testando (nel mio caso faustogiungato.com).

google-tag-manager-debug-8

  • Una volta cliccato, ti si aprirà in una nuova finestra del browser il sito che stati testando con una tab simile a quella qui sotto:

debug google tag manager

  • Come vedi, Google Tag Manager ti mostra quali sono i tag che sono attivi nella pagina (“Tags Fired On This Page”) e quelli non ancora attivati (“Tags Not Fired On This Page”): per testare che tutto funzioni, provo a cliccare sull’indirizzo email che ho inserito nel footer del mio sito.

debug google tag manager

  • Et voilà: appena clicco sulla email, nella tab compare l’ “Email link click” frai “Tags Fired On This Page”, segno che il codice creato in Google Tag Manager funziona perfettamente.

 

 

6° step: Controlla in Google Analytics i click

tracciare clicks in eventi di Google Analytics

Dove vengono immaganizzate tutte queste informazioni sui click?

Ovviamente, in Google Analytics.

In particolare, in “Comportamento” >> “Eventi” >> “Principali Eventi” riuscirai a vedere tutti i click sulle email, sui PDF scaricati o su tutto ciò che vuoi tracciare nel tuo sito (vedi sopra una schermata esemplare).

 

Buon tracking a tutti!

 

Nota: l’immagine principale del post è designed by Freepik

3,505 Visite totali, 9 visite odierne

Sommario Articolo
Tracciare i click sul tuo sito con Google Tag Manager
Nome Articolo
Tracciare i click sul tuo sito con Google Tag Manager
Descrizione
Videotutorial su come tracciare i click sulle email e i numeri di telefono e i download del tuo sito web.
Autore dell'Articolo
Scroll Up
Altro... Analytics, SEO, Tecniche
attori-posizionamento-locale-seo-2017
I 10 fattori di posizionamento della Local SEO

Finalmente è arrivato il Survey di Moz sui fattori di posizionamento locale (Local SEO), con un certo ritardo rispetto alla...

Chiudi