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"

Come tracciare click al link Phone con Google Tag Manager

come-tracciare-i-click-al-link-Phone-con-Google-Tag-Manager

Per semplificare il contatto da parte degli utenti, soprattutto da mobile, è buona norma collegare il numero di telefono della tua azienda pubblicato nel tuo sito ad un link in modo che, quando cliccato da un utente, avvii in automatico la telefonata. Questo è quello che intendiamo con “link Phone”.

Ti spiegherò ora come utilizzare Google Tag Manager per tracciare quando un utente clicca sul link Phone ed avere molte informazioni aggiuntive su questo click!

Step 1 – Crea l’attivatore

Per prima cosa devi creare un attivatore. Vai nella scheda Attivatori > Nuovo.

Imposta l’attivatore così:

Evento: “Clic”.
Configura attivatore: “Solo link”. Flagga Attendi i tag.
Tempo di attesa massimo: 2000 millisecondi.
Flagga Verifica convalida.

“Continua” ed indica ora in quale pagina l’attivatore dev’essere abilitato. Se il tuo link Phone è nel footer, attivalo in tutte le pagine impostando: “Page URL Corrisponde all’espressione regolare .*. Clicca “Continua”.

Attiva su “Alcuni link” ed imposta “Click URL Contiene tel:”.

Salva l’attivatore e nominalo “Attivatore Phone Click“.

tracciare-link-phone-1

Step 2 – Attiva le variabili

Dalla scheda variabili attiva tutte le variabili relative ai Click. Si tratta di variabili predefinite e quindi già presenti in Google Tag Manager.

tracciare-il-link-mailto-2

Step 3 – Crea il tag

Non ti resta che creare il tag. Vai quindi nella scheda Tag > Nuovo.

Imposta:

Scegli prodotto: “Google Analytics”.

Scegli un tipo di tag: “Universal Analytics”.

ID di monitoraggio: inserisci il tuo codice di monitoraggio di Analytics oppure la variabile “gaID” che dovresti aver già creato (se non lo hai fatto ti invito a dare un’occhiata qui)
Tipo di monitoraggio: “Evento”.
Categoria: “Phone”
Azione: “Click”
Etichetta: {{Page Path}}
Hit da non interazione: “False” (in modo da influire sul Bounce Rate)

Ora puoi cliccare “Continua”.

Attiva su “Altro” e seleziona l’attivatore creato in precedenza: “Attivatore Phone Click“.

Crea il tag denominandolo “GA – Event – ClickPhone”.

tracciare-link-phone-3

Come di consueto, verifica la corretta implementazione del tag con la funzione Visualizzazione in Anteprima e Debug: visualizzerai il tag sotto la voce “Tags Not Fired On This Page:”. Una volta cliccato il link del numero di telefono, dovresti vedere il tag spostarsi su “Tags Fired On This Page:”.

Inoltre, una volta cliccato il link dovresti veder comparire nel “Summary” un nuovo evento denominato gtm.linkClick. Dalla scheda VariabiliData Layer potrai vedere tutte le informazioni raccolte su questo click.

tracciare-link-phone-4

Puoi ora tenere traccia dei click degli utenti sul link Phone da Google Analytics, andando su Tempo reale > Eventi.

Ora tocca a te, prova ad implementare questo evento! Buon Tag!

16 commenti su “Come tracciare click al link Phone con Google Tag Manager

  1. Ciao Matteo ottima guida grazie, ho implementato il tag per Call ieri e avrei una domanda:
    Su Google Analytics vedo correttamente nella sezione In tempo reale > Eventi quelli degli ultimi 30min, ma gli eventi che ad es. ho fatto ieri notte, In tempo reale logicamente non ci sono più e se vado in Comportamento > Eventi non trovo nulla, come mai? Dove vedo lo storico degli Eventi scatenati?
    Grazie MILLE!
    Ros

    • Ciao Ros,
      gli eventi li trovi sotto il menù Comportamento ► Eventi.

      A presto!

  2. Ciao Matteo,
    io ho la necessità di monitorare le chiamate verso un numero di telefono sul sito web
    (opzione n. 2 nelle conversioni per le telefonate in AdWords), usando Tag Manager.
    In questo caso AdWords ci passa un Tag, simile al seguente:

    (function(a,e,c,f,g,b,d){var h={ak:”XXXXXXXXX”,cl:”XXXXXXXXXXXXXXXXXXX”};a[c]=a[c]||function(){(a[c].q=a[c].q||[]).push(arguments)};a[f]||(a[f]=h.ak);b=e.createElement(g);b.async=1;b.src=”//www.gstatic.com/wcm/loader.js”;d=e.getElementsByTagName(g)[0];d.parentNode.insertBefore(b,d);a._googWcmGet=function(b,d,e){a[c](2,b,h,d,null,new Date,e)}})(window,document,”_googWcmImpl”,”_googWcmAk”,”script”);

    nonchè uno snippet così come definito in questa pagina della guida https://support.google.com/adwords/answer/6095883?&hl=it&authuser=0#gfn

    Nel mio caso devo usare lo snippet riportato nell’esempio 3 della suddetta pagina
    della guida.

    La domanda è la seguente: come implementare tutto ciò con Tag Manager?
    Devo comunque inserire lo snippet nelle mie pagine HTML oppure è possibile
    passare anche lo snippet attraverso Tag Manager?

    Mille grazie

    Vincenzo

    • Ciao Vincenzo ottimo spunto potrei assolutamente fare una guida dedicata.

      La soluzione è la seguente:

      1- Crea un Tag HMTL personalizzato inserendo lo snippet di conversione:

      (function(a,e,c,f,g,b,d){var h={ak:”XXXXXXXXX”,cl:”XXXXXXXXXXXXXXXXXXX”};a[c]=a[c]||function(){(a[c].q=a[c].q||[]).push(arguments)};a[f]||(a[f]=h.ak);b=e.createElement(g);b.async=1;b.src="//www.gstatic.com/wcm/loader.js";d=e.getElementsByTagName(g)[0];d.parentNode.insertBefore(b,d);a._googWcmGet=function(b,d,e){a[c](2,b,h,d,null,new Date,e)}})(window,document,"_googWcmImpl","_googWcmAk","script");
      

      Questo tag lo devi attivare al pageview (in tutte le pagine o nella pagina che vuoi tracciare)

      2- Devi avere un id o un CSS identificativo nel numero di telefono per permettere il search/replace come descritto nella guida che hai linkato. Prendo il primo esempio (cambia le parantesi quadre con minore e maggiore):

       [span class="number"]1-800-123-4567[span]
      

      3- Crea un Tag HTML personalizzato inserendo questo testo

      [script]
      _googWcmGet('number', '1-800-123-4567')
      [/script]
      

      Questo tag lo devi attivare nelle pagine o nella pagina che ti interessa. La particolarità è che devi usare un attivatore di tipo visualizzazione di pagina con “tipo di attivatore” ► Finestra Caricata

      Fammi sapere.

      A presto!

    • Grazie mille Matteo,
      nel mio caso ho più di un posto nella stessa pagina HTML che riportano l’elemento
      telefono così formattato:

      in un posto:

      in altri 2 posti:
      335.XXX.XX.XX

      il numero di telefono è sempre lo stesso.

      Quale soluzione in questo caso?

      Grazie Mille
      Vincenzo

    • Ciao Vincenzo, semplicementi associ 3 id o classi univoche e chiami 3 volte la funzione

      _googWcmGet('number', '1-800-123-4567');
      _googWcmGet('number2', '1-800-123-4567');
      _googWcmGet('number3', '1-800-123-4567');
      

      Fammi sapere 🙂

    • (scusa, ora uso le quadre al posto di minore e maggiore)

      Grazie mille Matteo,
      nel mio caso ho più di un posto nella stessa pagina HTML che riportano l’elemento
      telefono così formattato:

      in un posto:
      [a id=”tel” href=”tel:+39335XXXXXXX”][img src=”chiama.jpg” alt=”Chiama”/][/a]

      in altri 2 posti:
      [a class=”tel” href=”tel:+39335XXXXXXX”]335.XX.XX.XXX[/a]

      il numero di telefono è sempre lo stesso.

      Quale soluzione in questo caso?

      Grazie Mille
      Vincenzo

    • Ciao Vincenzo, prova ad inserire degli id univoci o delle classe univoche per elemento. Un’altra soluzione sarebbe quella di ciclare tutti gli elementi che contengono la stessa classe, ma visto che da come ho capito puoi mettere mano al codice usa dei valori univoci.
      A presto!

    • ma credo che _googWcmGet(‘number’, ‘1-800-123-4567’); così com è, pesca solo la classe,
      e non l’id, inoltre non sostituisce il numero di inoltro in href=”tel:+39335XXXXXXX”
      forse ci vuole un ulteriore snippet, è giusto ?

    • Si esatto. Per l’id trovi il codice da implementare nella guida che hai citato alla voce Esempio 2. Passaggio del numero di inoltro di Google a una funzione di richiamata personalizzata: https://support.google.com/adwords/answer/6095883?&hl=it&authuser=0#gfn

    • grazie mille Matteo
      Vincenzo

  3. Ciao Matteo, sono riuscito a far funzionare l’attivatore cambiando la voce Link con tutto. Ora però mi conteggia solo quelli provenienti da desktop e non quelli da mobile. Ha idee in merito?

    • Ciao Michael, in realtà non ci sono condizioni nell’attivatore o tag dove è possibile gestire il device. Quindi quello che potrebbe essere è che da mobile cambi qualche condizione per cui l’attivatore non è visibile (es la classe o l’id che magari hai inserito nella condizione dell’attivatore non è valido). Hai provato a fare dei test dal tuo smartphone? Il link di tipo phone risulta esserci da mobile?
      Fammi sapere!

  4. Salve,
    grazie mille per gli articoli presenti in questo sito che ho configurato correttamente.

    L’unico che non vuole proprio funzionare (dopo avere provato e riprovato) è quello del telefono.
    Ho impostato il link al cellulare come tel:328000000 come href.

    In cosa sbaglio ?

    • Ciao Marco, lieto di sentire che hai messo in opera le mie guide 🙂
      Posso consigliarti di impostare la regola sull’attivatore: Click URL “inizia con” e come valore “tel:” oppure se hai un solo numero potresti mettere Click URL “uguale a” e mettere “tel:[tuo-numero]” dove [tuo-numero] è il valore del telefono.

      Fammi sapere!

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!