Guida Base: Tracciare Click sui Pulsanti con Google Tag Manager

[Aggiornata il 01 Agosto 2022]

Attenzione: in seguito al provvedimento del Garante Privacy italiano che ha dichiarato illecita l’implementazione di Google Universal Analytics (GA3) su un sito web, è necessario eliminare il prima possibile la proprietà di GA3 dai propri progetti web e passare subito a GA4.

Se non hai dimestichezza con GA4 e desideri imparare a padroneggiare nel modo corretto questo strumento, nel mio libro su GA4 “Google Analytics 4 per chi inizia” ti guido passo passo per imparare a utilizzarlo in maniera semplice e pratica.

In fondo a questo articolo troverai il link alla guida su come tracciare i click sui pulsanti in GA4 🙂

–

Tracciare anche i pulsanti e non solo i link? In questa guida ti spiegherò come fare. Per farlo dovremmo utilizzare un Attivatore di tipo click che gestisca tutti gli elementi. Successivamente dovremmo utilizzare un sistema univoco per identificare il pulsante. Solitamente i pulsanti hanno una classe o un ID che li identifica. Poniamo il caso che il pulsante abbia il valore class=”button”.

Psss… per questa guida devi attivare le variabili click. Se non l’hai già fatto ti spiego come nella guida su Come attivare le Variabili Integrate in Google Tag Manager

Step 1 – Crea l’attivatore

Per prima cosa entra in Google Tag Manager, clicca su:

Attivatori > Nuovo > Configurazione attivatore.
Tipo di attivatore: Clic – Tutti gli elementi.
Attiva su: Alcuni Click.
Aziona l’attivatore quando: Click Classes contiene button.
Nel caso il tuo pulsante sia presente su particolari pagine puoi aggiungere una ulteriore condizione mettendo il Page Path uguale alla tua pagina o ad una espressione regolare
Salva l’Attivatore nominandolo prima “Click Button”.

*Click Classes è una Variabile Integrata. Se non la trovi vuol dire che devi ancora attivarla: qua c’è la guida su Come attivare le Variabili Integrate in Google Tag Manager. Stessa cosa vale per Page Path e Click Text, che troverai a seguire.

Step 2 – Crea il tag

Dovrai ora creare un nuovo Tag:

Tag > Nuovo > Configurazione tag.
Tipo di tag: Universal Analytics.
Tipo di monitoraggio: Evento.
Categoria: Click Button.
Azione: {{Page Path}}
Etichetta: {{Click Text}}
Hit da non interazione: False.
Adesso seleziona la Variabile delle impostazioni di Google Analytics in Impostazioni di Google Analytics, se l’hai creata, oppure abilita l’override e seleziona la costante {{gaID}} (che dovresti avere se hai seguito la mia guida su come creare una costante per l’ID di monitoraggio di GA). In alternativa inserisci semplicemente il tuo codice UA-XXXXXX-X.
Attivare il Tag sull’Attivatore appena creato “Click Button”.
Dai un nome al Tag, ad esempio “GA – Event – Click Button” e salvalo.

Step 3 – Visualizza in anteprima

Come al solito prima di pubblicare le modifiche ti consiglio di Visualizzare in Anteprima il funzionamento del Tag creato.

Dall’interfaccia di Google Tag Manager clicca sul pulsante in alto a destra “Anteprima” e vai nel tuo sito in una pagina che contenga un bottone che vuoi tracciare.

Nella finestra in basso dello schermo visualizzerai tutti i Tag attivati e non attivati attualmente. All’inizio vedrai il Tag “GA – Event – Click Button” sotto i Tags Not Fired On This Page.

Clicca ora un bottone presente nella pagina. Il Tag dovrebbe comparire ora tra i Tags Fired On This Page.

Funziona tutto correttamente? Allora non ti resta che chiudere la modalità Anteprima, cliccare il tasto blu “Invia”, inserire i dettagli della versione e pubblicare: sei pronto a tracciare tutti i click sui bottoni da parte degli utenti!

E se uso Google Analytics 4?

Se cerchi una guida di Google Analytics 4 che ti spieghi come tracciare i click sui pulsanti in GA4, allora non ti preoccupare 😀

Ecco la guida: Come tracciare i click sui pulsanti in GA4 con Google Tag Manager

Alla prossima guida e… buon Tag!

Altre Guide che potrebbero interessarti

Matteo Zambon

Next Guida Avanzata: Come Tracciare lo Scrolling dopo 30 Secondi con Google Tag Manager »

Previous « Glossario: Cos'è Bit.ly

View Comments

Carlo says:

20 Ottobre 2021 at 23:07

Ciao Matteo, in primis, complimenti. In poco tempo e spazio riesci a rendere tutto molto affrontabile.
Nonostante questo, ho dubbio, altrimenti sarebbe troppo facile :)

Premessa: ho seguito tutti i procedimenti che stanno alla base --> ho creato gli attivatori clic ed attivato le variabili più comuni.

Riprendo un attimo la tua procedura:

Tag > Nuovo > Configurazione tag. Ok
Tipo di tag: Universal Analytics. OK
Tipo di monitoraggio: Evento. OK
Categoria: Click Button. --> Questo lo inserisci tu a mano, giusto? Perchè io non ce l'ho, però ho "attivato" gli attivatori come te.
Azione: {{Page Path}} OK
Etichetta: {{Click Text}} OK
Hit da non interazione: False. OK

Il problema della categoria l'ho riscontrato anche con il tag per "clic sulla tab". Per il resto è tutto molto chiaro, però se potessi spiegarmi meglio questo punto te ne sarei grato.

Grazie mille,
Carlo
- Matteo Zambon says:
  
  21 Ottobre 2021 at 17:10
  
  Ciao Carlo e grazie del feedback :D
  
  Si, esatto. Categoria, Azione ed Etichetta sono tutte e tre a scelta tua. Rappresentano la nomenclatura che ritrovi poi nei report di Google Analytics. Puoi inserirci letteralmente quello che vuoi, ovviamente è buona norma dargli un nome riconoscibile e delle informazioni in più sull'evento.
  
  PS: Ti consiglio il corso Google Analytics ABC che trovi qui: https://club.tagmanageritalia.it/corso-google-analytics-abc/
  
  Buon Tag!
Matteo says:

7 Ottobre 2021 at 16:37

Ciao Matteo grazie per il tuo lavoro! Con Analytics 4 il procedimento è ancora più facile mi confermi?
- Matteo Zambon says:
  
  7 Ottobre 2021 at 17:55
  
  Ecco la guida :D
  https://www.tagmanageritalia.it/guida-base-tracciare-i-click-sui-pulsanti-in-ga4-con-google-tag-manager/
Adriana says:

14 Giugno 2021 at 10:51

Ciao Matteo, grazie mille.
Tramite Tag Manager ho attivato sia Analytics che Optimize.
Vorrei fare degli A/B Test e capire, analizzando i click su particolari bottoni, quale performa meglio.
Ho impostato come obiettivo su Tag Manager il click su una determinata classe applicata ai bottoni che mi servono viene rilevato correttamente.
Ora: come faccio a far parlare Optimize con Tag Manager? A dire a Optimize che come obiettivo deve prendere quello impostato su Tag?
- Matteo Zambon says:
  
  16 Giugno 2021 at 11:25
  
  Ciao Adriana :)
  Hai seguito la guida che spiega come implementare Google Optimize con Tag Manager?
  
  Ti lascio il link
  https://www.tagmanageritalia.it/guida-base-installare-google-optimize-google-tag-manager/
  
  Buon Tag!
Michele says:

26 Gennaio 2021 at 16:52

Ciao Matteo, grazie per la tua Guida.
Mi trovo in difficoltà a configurare lo step 2 con GA4..
Cosa devo impostare su:
- nome evento
- nome parametro e valore?

Considera che il tipo di attivatore è "clic classes" corrispondete a un selettore CSS (è un bottone in pratica, ho usato la sua classe CSS per identificarlo)
- Matteo Zambon says:
  
  2 Febbraio 2021 at 12:28
  
  Ciao Michele, a breve farò delle guide specifiche su GA4.
  
  Sei tu che decidi il nome evento. Puoi sceglierli tra la lista: https://support.google.com/analytics/answer/9234069 (nel tuo caso click) e come parametri sei sempre tu che decidi. Il Tag è tipo evento di GA4.
  
  Qua trovi alcuni riferimenti alle guide finora create: https://www.tagmanageritalia.it/tag/google-analytics-4/
  
  Fammi sapere!
Alessio says:

31 Agosto 2020 at 12:06

Ciao Matteo,

Innanzitutto grazie per l'importante base di conoscenza, le tue guide sono utilissime e molto chiare.

Volevo sapere se esiste un modo per non contare gli hit ripetuti su un tasto (es: se ho una connessione lenta io utente posso cliccare sul tasto più di una volta),magari impostando una finestra temporale entro la quale il tag non viene conteggiato più di una volta dopo il primo hit.

Grazie!
- Matteo Zambon says:
  
  3 Settembre 2020 at 11:09
  
  Ciao Alessio, si è possibile. Ho proprio creato una metrica che permette di analizzare questa tipologia di azione. È parte del Club Tag Manager Italia e ho anche realizzato un corso che sto per pubblicare. Se ti interessa mandami una email a help@tagmanageritalia.it così ti faccio contattare dal mio staff per spiegarti tutte le dinamiche per accedere a questa guida/corso :)
  
  A presto!
Alessandro says:

29 Maggio 2020 at 15:06

Ciao Matteo,
Grazie per la spiegazione, sto avendo un problema con l'implementazione del tag.
Ho seguito tutti i passaggi inserendo:

1) Attivatore inserendo la regola "Click classes contiene button"
2) Il tag collegato all'attivatore precedente come da tua descrizione con azione "Page path" etichetta "click text" collegandolo al mio UA-XXXXX
3) Versione anteprima però mi evidenzia il "Tags not fired"

L'obiettivo era quello di tracciare "add to cart, product page view, check out e purchase" sulle mie Ads

A presto!
- Alessandro says:
  
  2 Giugno 2020 at 00:42
  
  Ciao Matteo,
  
  Grazie per la rapida risposta!
  
  Non c'è un argomento chiaro su come estrapolare i dati dall'elemento DOM, ma soprattutto come creare o trovare un documento DOM e di conseguenza sviluppare una variabile all'interno di Manager ( servirebbe una guida come questa quì sopra ).
  
  Se masticassi solamente un basic HTML e ti dicessi che avessi trovato nell'elemento Add to cart i seguenti dati:
  
  Add to cart
  € 95.99
  
  Probabilmente dovrei utilizzare la regola "Click classes contiene "ProductForm__AddToCart Button Button--primary Button--full" data-action="add-to-cart"
  
  Ma, dopo una svariati tentavi penso che manchi qualcosa perché il "Tag is not fired" cosa mi consiglieresti?
  - Matteo Zambon says:
    
    4 Giugno 2020 at 16:16
    
    Ciao Alessandro, ti consiglierei di entrare nel Club se vuoi un boost nell'apprendimento :)
    L'argomento non è chiaro perché lo scraping lo puoi fare in diversi modi e soprattutto sei condizionato a seconda di come è strutturata la pagina HTML. In questa guida faccio l'esempio dell'add to cart: https://www.tagmanageritalia.it/guida-base-implementare-aggiungi-al-carrello-nel-pixel-facebook-google-tag-manager/
    In questa del purchase: https://www.tagmanageritalia.it/guida-base-implementare-la-transazione-nel-pixel-facebook-google-tag-manager/
    
    Probabilmente ti manca il carattere punto nella condizione.
- Matteo Zambon says:
  
  1 Giugno 2020 at 16:47
  
  Ciao Alessandro, devi verificare qual è il selettore CSS di quei pulsanti (o se hanno un ID meglio ancora). Qui c'è una piccola spiegazione: https://www.tagmanageritalia.it/glossario-css-selector/
  
  Fammi sapere!
matteo says:

30 Aprile 2020 at 15:17

ciao guida fantastica" ho impostato il clickout con tag manager. Ora come faccio a vedere le conversioni nei report di Google Ads?

se vado in" Importa azioni di conversione" non ci sono eventi da importare!

grazie in anticipo
- Matteo Zambon says:
  
  1 Maggio 2020 at 20:11
  
  Ciao Matteo, devi creare l'obiettivo in Google Analytics basato sull'evento. Così puoi importare poi gli obiettivi in Google Ads (https://www.tagmanageritalia.it/glossario-obiettivi-di-google-analytics/).
  
  Fammi sapere, a presto!
Simone says:

4 Aprile 2020 at 20:55

Ciao Matteo,

volevo sapere se è possibile tracciare i clic sui pulsanti a degli iframe embeddati in una pagina del sito (come quelli di Google moduli). Io ho provato seguendo le indicazioni dell'articolo ma niente (non so se sbaglio qualcosa o se quello che provo a fare a questo punto non è possibile). Grazie,

Simone
- Matteo Zambon says:
  
  6 Aprile 2020 at 17:09
  
  Ciao Simone. Il tema iframe è abbastanza complicato. Per farla semplice posso dirti che per tracciare le cose contenute nell'iframe hai bisogno dell'accesso di un GTM dentro l'iframe. Quindi al momento attuale quello che chiedi non è fattibile.
  
  A presto!
Francesco says:

31 Marzo 2020 at 11:12

Bravi, bravissimi, guida perfetta. Tra l'altro ho avuto bisogno di supporto e in un attimo via chat sono stato aiutato, avevo scordato di attivare la variabile integrata {{Click Text}}. Ottimo lavoro e servizio di assistenza.. e pensare che è tutto gratuito, chissà quando si paga cosa offrite, anche il caffé :-) ? Grazie!
- Matteo Zambon says:
  
  31 Marzo 2020 at 11:48
  
  Grazie Francesco :) Ho aggiunto un ulteriore dettaglio nella guida, così evitare ai prossimi lettori di avere lo stesso problema.
  
  Fidati che avresti sicuramente mooooolte più cose nel Club, sia a livello di assistenza che di contenuti. Per maggiori informazioni puoi iscriverti alla lista di attesa da qui: https://club.tagmanageritalia.it/lista-attesa-club-tmi/
  
  A presto!
Giorgio says:

29 Febbraio 2020 at 09:36

Ciao Matteo!

Grazie per le tue guide, molto utili :)

Una domanda: quando crei il tag non mi è chiaro con che criterio compili i campi Categoria, Azione ed Etichetta. Il testo che inserisci te lo inventi tu oppure esiste una nomenclatura predefinita da seguire? E cosa significano le parentesi graffe?

Grazie della risposta !

Giorgio
- Matteo Zambon says:
  
  2 Marzo 2020 at 18:36
  
  Ciao Giorgio e grazie del feedback.
  I valori sono a discrezione di chi li compila :D In altre parole sei tu a decidere, non ci sono vincoli.
  
  All'interno del Club Tag Manager Italia spiego alcune metodologie per capire come usare al meglio questi parametri ;)
  Se ti interessa puoi iscriverti alla lista di attesa: https://club.tagmanageritalia.it/lista-attesa-club-tmi/
  
  A presto!