it
English Español Deutsch Français Italiano Português (Brasil) Русский 中文 日本語
Invia il post
Vai al Blog
Amplia le tue conoscenze:
Google Tag Manager
Matteo Zambon

Google Tag Manager: guida d'uso

66
Wow-Score
Il Wow-Score mostra il livello di interazione del posto di un blog. Si calcola sulla correlazione tra il tempo di lettura attivo degli utenti, la loro velocità di scrolling e la lunghezza dell'articolo.
Matteo Zambon
Google Tag Manager: guida d'uso

Come impostare i comandi e le funzioni più utili di Google Tag Manager

Aspetta, aspetta provo ad indovinare... Vorresti una guida pratica su come attivare Google Tag Manager (GTM) e, soprattutto, capire le sue funzioni più utili :)

Ho due notizie. Una buona e una cattiva.

La buona notizia

La notizia positiva è che in questo articolo ci sarà proprio una guida passo passo che ti spiegherà come configurare Tag Manager, quali sono le sue funzionalità e alcune implementazioni.

L'articolo sarà suddiviso in:

  • Perché dovresti iniziare ad usare Google Tag Manager.
  • Le sue funzionalità (e GTM non è web analytics).
  • Alcuni Tag indispensabili.

Tutto bello, vero? mmm... NO. Ahimè, c'è una cattiva notizia :(

La cattiva notizia

La notizia cattiva è che il tool è in continua evoluzione. Google stesso lo sta spingendo molto.
Questo significa che non bisogna mai smettere di aggiornarsi e, soprattutto, sperimentare. Inoltre, per implementazioni avanzate, bisogna conoscere bene Javascript, CSS e come funziona il DOM delle pagine (nel caso web, mentre nel caso delle APP è diverso).

E quindi?

Nessun timore. Partiamo con calma. Alla fine dell'articolo ti suggerirò alcune informazioni che ti permetteranno di trasformare questa brutta notizia in una bella.

Primo passo - Cos'è Google Tag Manager?

Dai, lo sai, vero? Sì che lo sai.

Ok, facciamo finta che tu lo debba spiegare ad un amico.
Quello che dovresti dirgli è che GTM è un software online gratuito (sì, di Google) che permette di installare del codice all'interno delle pagine web del tuo sito (o app mobile). Quindi, in sostanza, puoi inserire dei codici (tipicamente chiamati snippet o meglio ancora TAG) direttamente dalla piattaforma online senza delegare al programmatore di turno l'installazione di quel codice. Oltre a questo hai tutta una serie di benefici non banali. Vediamone alcuni (solo alcuni):

  • Non sei vincolato dal programmatore ad installare Google Analytics, Remarketing di Adwords, Conversioni di Adwords, Pixel di Facebook, Hotjar e qualsiasi altro tool esterno che ti viene in mente.
  • Non essendo vincolato dal programmatore, non hai latenze di tempo. Zero problemi.
  • È multiutente, un po' come Google Analytics. Possono esserci più utenti che lavorano insieme con - se vuoi - autorizzazioni diverse.
  • Offre la possibilità di lavorare in team, grazie alle aree di lavoro (o workspace).
  • "Ops, ho sbagliato!" non accadrà più. Grazie al versioning potrai fare rollback alla versione precedente di pubblicazione.
  • "Ma funzionerà?". Nemmeno questo accadrà. C'è un debug e preview nativo nella piattaforma.
  • Sporchiamoci le mani! Puoi tranquillamente farlo grazie agli ambienti. In sostanza se hai un server di produzione e un server di staging (o di sviluppo) puoi tranquillamente decidere in che ambiente pubblicare le modifiche (senza creare un altro contenitore dedicato ai due server).
  • È user-friendly. Super interfaccia in material design che facilita di molto l'apprendimento e la velocità di implementazione.
  • Non rallenta il caricamento delle tue pagine. Grazie al suo motore asincrono, GTM gestisce i vari tag caricandoli in parallelo con il caricamento della pagina.
  • "Argh! non funziona lo snippet installato". Dimentica questo problema. Con GTM i conflitti di codice sono pari a zero.
  • Aumenta le tue performance. Esistono moltissimi Tag predefiniti a cui bastano pochissime configurazioni per abilitarli. 
  • Niente perdite di tempo. Puoi facilmente esportare ed importare configurazioni complete da un contenitore all'altro. In altre parole puoi importare gli stessi tag su siti diversi in 5 secondi netti.
  • Puoi condividere il debug e preview anche a chi non ha accesso alla piattaforma (anche in chat se vuoi), grazie ad un link.

Ok, fermiamoci qui. Credo di esser riuscito ad esprimere i benefici principali.

Se hai ancora dubbi, non ti preoccupare. Qui trovi un bell'articolo specifico su cos'è Google Tag Manager.

Non ti basta? Ecco un webinar di SEMrush dove spiego i problemi che questo strumento può risolvere.

Bando alle ciance. Installiamo Google Tag Manager

La prima cosa da fare è avere un account Google e andare su tagmanager.google.com

A quel punto ti verrà richiesto di creare l'account:

Creazione account in Google Tag Manager

Tipicamente viene inserito il nome dell'azienda.

Successivamente viene chiesto di impostare il primo contenitore con la scelta della tipologia:

  • Website;
  • iOS;
  • Android;
  • AMP.

Creazione contenitore Google Tag Manager Creazione contenitore GTM

A questo punto la tua configurazione su GTM è stata creata. La prossima cosa da fare è implementare i due snippet di codice che compaiono subito dopo. 

Google Tag Manager: come implementare gli snippet di codice GTM: come implementare gli snippet di codice

Dovranno essere rispettivamente inseriti nell'head e nel body. Nel dettaglio:

<!-- Google Tag Manager --><br/><script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':<br/>new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],<br/>j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=<br/>'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);<br/>})(window,document,'script','dataLayer','GTM-PDDC9N');</script><br/><!-- End Google Tag Manager --><br/>

Va inserito nel tag &lt;head&gt;

Il mio consiglio è inserirlo come primo script dopo le varie librerie (es: jQuery). Ovviamente il codice di GTM (GTM-PDDC9N nell'esempio) cambia sempre a seconda del contenitore.

<!-- Google Tag Manager (noscript) --><br/><noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PDDC9N"<br/>height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript><br/><!-- End Google Tag Manager (noscript) --><br/>

Questo invece va assolutamente inserito immediatamente dopo l'apertura del &lt;body&gt;.

Fatto questo, GTM è pronto per essere usato :)

Secondo passo - Le funzionalità di Google Tag Manager

Ok, abbiamo visto come installarlo. Facciamo un passo indietro. Com'è fatto GTM e quali sono le sue funzionalità?

Il concetto è semplice. GTM è formato da mattoncini, ognuno dei quali ha una funzione:

  • Variabili (no, non sono cose brutte);
  • Datalayer (questo potrebbe essere una brutta cosa);
  • Attivatori (o trigger in inglese);
  • Tag.

Le variabili

Le variabili sono dei contenitori che mettono a disposizione delle informazioni. Queste informazioni possono essere presenti in pagina oppure presenti in altri strumenti (es. Google Analytics, Database del sito, eccetera). Le variabili servono sia agli attivatori che ai tag.

Datalayer

Il datalayer non è altro che un oggetto (un array javascript, se vogliamo essere proprio dei nerd informatici) che contiene una serie di informazioni che possono essere usate da GTM. Immagina come se fosse uno strato, un livello che comunica con il sito web e con tutti gli strumenti che vengono collegati con GTM (quindi Google Analytics, Facebook, Adwords, e così via). In pratica è il mattone che collega GTM al mondo esterno.

Attivatori

Gli attivatori non sono altro che i "semafori" che decidono se far funzionare o meno un tag. In pratica sono delle regole che puoi impostare. Ad esempio potresti creare un attivatore solo su determinate pagine (ad esempio una thank-you page) e collegarlo ad un tag (ad esempio un tag di conversione AdWords e/o Facebook).

Tag

Ed eccoci ai tag. Il tag, come già anticipato, non è altro che uno snippet di codice che viene caricato ed eseguito da GTM. Esistono tag predefiniti (Google Analytics, Adwords, Hotjar, eccetera...), ma la vera magia sono il tag HTML personalizzato e l'immagine personalizzata. Grazie a questi è possibile davvero inserire qualsiasi cosa.

Terzo passo - I Tag indispensabili

Qui ti lascio un elenco di guide passo passo di alcuni tag indispensabili che dovresti gestire con GTM.

1. Come implementare Google Analytics in Google Tag Manager:

In questa guida ti spiego come fare a inserire lo snippet di Google Analytics in GTM Forse l'avrai intuito da te, ma questa è solitamente è una delle prime cose che viene fatta una volta installato il tool :)

2. Tracciare click sui pulsanti con Google Tag Manager:

Una guida base che ti spiega come fare a tracciare i pulsanti utilizzando un attivatore di tipo click. Tutto questo in soli tre step, promesso!

3. Come tracciare click al link phone con Google Tag Manager:

Sai quando in un sito web il numero di telefono è un link cliccabile (link phone, quello che inizia con tel: per capirci)? Bene, anche quel link lì può essere tracciato, ovviamente. Nella guida trovi anche un mio video tutorial che ti spiegherà come fare.

4. Come tracciare click al link mailto con Google Tag Manager:

Anche i click sull'email di contatto che hai lasciato nel tuo sito possono essere tracciati, naturalmente! Ti spiego come fare anche questo, il tutto grazie a GTM.

5. Come tracciare download pdf con Google Tag Manager:

In questo caso invece ti spiego passo passo come tracciare chi scarica un file PDF dal tuo sito. 

6. Come tracciare le pagine di errore 404 con Google Tag Manager:

Cominciamo ad andare su altri tipi funzionalità di GTM. Facciamo finta che nel tuo sito ci siano delle pagine non più esistenti. Una bella rogna, no? Sapevi che potevi scovare gli errori 404 tramite GTM?
Qua ti spiego come si fa:

7. Come impostare l'Adjusted Bounce Rate con Google Tag Manager

L'Adjusted Bounce Rate, un simpatico termine che vuol dire "Frequenza di rimbalzo adattata", è importante perché ti permette di ottenere informazioni più veritiere sul comportamento degli utenti. Anche questo può essere impostato con il tool di Google.

8. Come configurare i parametri UTM con Google Tag Manager:

Con questa guida puoi scoprire come configurare i parametri UTM tramite GTM. 
Come, mi chiedi perché dovresti farlo? Ci sono vari motivi molto interessanti, se vuoi saperli non devi fare altro che leggere la guida! :)

9. Come configurare Cross Domain con Google Tag Manager:

Gestire il Cross Domain (o interdominio) è fondamentale perché ti permette di capire se l'utente che passa da un sito all'altro è sempre lo stesso oppure no. 
Naturalmente GTM ti viene in soccorso anche nella gestione del Cross Domain.

10. Installare Hotjar con Google Tag Manager:

Qui ti spiego come inserire lo snippet di Hotjar. È semplicissimo, vedrai!

11. Implementare il pixel di monitoraggio di Facebook con Google Tag Manager:

Il pixel di monitoraggio di Facebook non è altro che quel codice Javascript da utilizzare per monitorare i risultati delle proprie campagne Facebook. Anche questo può essere installato con GTM.

12. Implementare le conversioni di Bing UET con Google Tag Manager:

Anche le campagne Bing Ads possono essere tracciate. Qui ti spiego come implementare il tag UET (ovvero il codice di monitoraggio di Bing) grazie a GTM.

13. Installare Google Adwords Remarketing con Google Tag Manager:

Un bel tag di Remarketing Adwords può sicuramente aumentare le tue conversioni, riproponendo la pubblicità del tuo sito ad utenti che già lo hanno visitato in precedenza. Leggi la mia guida su come installarlo grazie a GTM.

14. Installare il monitoraggio delle conversioni di Google Adwords con Google Tag Manager:

Anche in questo caso - ma ormai non ne sarai più tanto sorpreso, scommetto - puoi implementare lo snippet di codice che ti permette di tracciare le conversioni provenienti dalle campagne Google AdWords.

15. Come abilitare Enhanced Ecommerce (per WooCommerce) con Google Tag Manager:

Enhanced Ecommerce, uno strumento di Google Analytics che ti permette di avere statistiche molto dettagliate sugli utenti del tuo ecommerce e sul loro comportamento d'acquisto. Leggi la guida: ti spiegherò come fare :)

16. Come abilitare lo User ID in Universal Analytics con Google Tag Manager:

Abilitando lo User ID in Analytics puoi collegare lo stesso utente a più dispositivi, identificandolo anche quando sta usando dispositivi diversi. Niente male, no? E quindi abilitalo! Come fare? Con GTM, che te lo dico a fare :)

E la brutta notizia? Come si sistema?

Dai, dimmi la verità. Sei saltato qui sotto fin da subito, vero?
Dunque, per essere sempre al passo con le implementazioni di Google bisogna seguire le fonti e tutti gli esperti del settore che in qualche modo condividono il loro sapere e le loro esperienze.

La fonte principale è senza dubbio il blog ufficiale di Analytics. A seguire il sito ufficiale degli sviluppatori di GTM. Esistono poi articoli di agenzie come Lunametrics e uno smanettone NERD finlandese di nome Simo Ahava. In italiano, invece, puoi consultare il mio sito.

Questo è tutto.

Hai ancora qualche dubbio su come utilizzare Google Tag Manager?

Lasciami un commento, sarò ben felice di rispondere alle tue domande :)

A presto e... buon Tag!

Matteo Zambon
Pro

Fa ottime domande e dà risposte brillanti.

​Amministratore dell’agenzia digitale In Risalto e fondatore di Tag Manager Italia – il club per gli utenti avanzati di Google Tag Manager - Matteo Zambon ha un’esperienza decennale come web developer senior, alla quale affianca una forte specializzazione in ambito SEM e SEO, con certificazione Google Partners e Google Analytics.

Rising Star nella sezione Analytics della Community di Google Italia, Matteo ha ideato e sviluppato diversi progetti strutturati di system integration, tra cui “IRMA” - il primo servizio pubblico in Italia di prenotazione mezzi per il trasporto pubblico a chiamata via SMS.

Primo divulgatore italiano di Google Tag Manager e figura di riferimento per l’apprendimento e la divulgazione di Google Tag Manager nei maggiori eventi del settore, Matteo è l’autore del primo libro in italiano sull’argomento (“Google Tag Manager per principianti”), tradotto in lingua inglese, bestseller su Amazon della sua categoria ed oggi alla sua seconda edizione su ► http://www.tagmanageritalia.it/anteprima-libro/

In aggiunta al libro, Matteo ha realizzato “Al Comando”, il primo ed unico videocorso in italiano su Google Tag Manager, considerato come il corso su Google Tag Manager più esteso, completo ed avanzato al mondo.
Amplia le tue conoscenze:
Google Tag Manager
Invia feedback
Il tuo feedback deve contenere almeno 3 parole (10 caratteri).

Utilizzeremo questa e-mail solamente per rispondere al tuo feedback. Informativa sulla privacy

Grazie per il tuo feedback!