Google Tag Manager Guida

Google Tag Manager Guida 2018: Cos’è e Come Funziona

Scritto da on . Postato in Web Analytics

Google Tag Manager guida per chi inizia dove vediamo tutti gli aspetti fondamentali di questo strumento: come impostare un account, come installare GTM sul nostro sito, come creare un nuovo tag e tanto altro. Se vuoi davvero iniziare a capirci qualcosa, oggi poniamo le basi per utilizzare sul serio questo fantastico tool.

Vediamo insieme:

Che cos’è Google Tag Manager?

Google Tag Manager (noto anche come GTM) è la soluzione gratuita di gestione tag fornita da Google. Tramite questo strumento è possibile distribuire e gestire i vari tag relativi ai tool di analisi e monitoraggio su un sito o un’app mobile.

Praticamente è una piattaforma di gestione degli script di tracking: permette di aggiungere un tag di tracciamento senza doverlo inserire fisicamente all’interno del codice HTML della pagina.

Google Tag Manager rende quindi l’intero processo di codifica molto più semplice. Tutto quello che devi fare è installare una tantum il codice contenitore di GTM in ogni pagina del tuo sito e, in seguito, ogni volta che desideri inserire un tag potrai farlo direttamente attraverso l’interfaccia del tool, senza bisogno di dover chiedere sempre supporto al tuo programmatore o dover scrivere nuovo codice nel sito.

Introduzione ai Tag: cosa sono ed esempi pratici

Un Tag è qualunque script o elemento di tracciamento che vogliamo inserire all’interno del nostro sito.

E’ quindi una porzione di codice JavaScript che viene installata in siti web o app per dispositivi mobili, col fine di raccogliere e inviare i dati di utilizzo a servizi di terze parti.

I servizi di terze parti potrebbero essere: Google Analytics, AdWords, Twitter, Facebook, Linkedin, etc.

Esempio Tag di monitoraggio Google Analytics:

< !-- Global site tag (gtag.js) - Google Analytics -- >
< script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXX-X" >< / script >
< script >
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXXXXXX-X');
< / script >

Esempio Tag Conversioni AdWords:

< !-- Global site tag (gtag.js) - Google Ads: XXXXXXXXX -- >
< script async src="https://www.googletagmanager.com/gtag/js?id=AW-XXXXXXXXX" >< /script >
< script >
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-XXXXXXXXX');
< /script >
< !-- Event snippet for Lead conversion page -- >
< script >
gtag('event', 'conversion', {'send_to': 'AW-XXXXXXXXX/TqAHCI_im4EBEKPp5dYD'});
< /script >

Quindi, come abbiamo appena visto, i tag sono semplicemente frammenti di codice.

Possiamo aggiungere questo snippet di codice (o tag) direttamente nel nostro sito web, copiandolo e incollandolo nei file del nostro template (come ad esempio il file header.php) oppure possiamo aggiungere il tag indirettamente sul nostro sito proprio tramite Google Tag Manager (GTM).

Google Tag Manager a cosa serve?

In pratica Google Tag Manager serve a risparmiare tempo, codice e soldi. Questo perché:

  1. elimina la necessità di modificare il codice del sito per aggiungere, rimuovere o modificare i tag;
  2. consente di testare i tag molto velocemente senza dover modificare il codice ogni volta sul tuo sito;
  3. rende possibile molteplici monitoraggi anche a chi non ha competenze avanzate.

Ad esempio, supponiamo di voler monitorare i clic su tutti i link esterni del nostro sito, in modo da poter determinare la quantità di traffico che stiamo inviando ad altri siti (inserzionisti, affiliati, etc.).

In questo caso, se utilizziamo Google Tag Manager possiamo completare questa attività in pochi minuti. Senza utilizzare GTM dovremo aggiungere il codice di monitoraggio eventi a ciascun link esterno, un’attività che richiede molto tempo e potrebbe comportare diversi errori.

Per adattarsi rapidamente ed economicamente ai cambiamenti del Web Marketing, dei motori di ricerca, del panorama dei social media, etc. è necessario muoversi rapidamente.

Non puoi permetterti di impiegare settimane o addirittura mesi, per aggiungere un tag al tuo sito solo perché il tuo sviluppatore è troppo impegnato ad aggiornare il catalogo prodotti.

Con GTM installato sul sito, i tag possono essere: aggiunti, modificati, testati o rimossi in pochi minuti. Ciò significa che puoi produrre e ottenere risultati più velocemente.

Principali vantaggi di GTM

La prima domanda che si pone chi inizia ad utilizzare questo strumento è la seguente: qual è il vantaggio di aggiungere i tag tramite GTM, quando possiamo aggiungerli direttamente nel codice del nostro sito?

Il vantaggio principale è che tramite GTM, puoi facilmente:

  • aggiungere;
  • rimuovere;
  • abilitare;
  • disabilitare;

qualsiasi tag sul tuo sito senza dover mettere mano al codice o installare plugin aggiuntivi al tuo CMS.

In linea generale, se non utilizzi Google Tag Manager dovrai aggiungere o rimuovere manualmente i tag da uno o più file del template del tuo sito e non potrai abilitarli o disabilitarli con facilità: per disabilitare un tag dovrai rimuoverlo dal file del template e, allo stesso modo, per abilitarne un altro dovrai aggiungerlo.

Inoltre, se desideri modificare la funzionalità di un tag, devi prima trovare manualmente i file del template in cui è stato inserito e quindi modificare il codice.

In questo modo ci sarà molto più lavoro da fare e ulteriori modifiche di codice da implementare, che potrebbero comportare degli errori soprattutto se il sito è di grosse dimensioni o se necessiti di diversi tag di monitoraggio.

Non utilizzare GTM indubbiamente comporta una gestione più complessa e macchinosa per mantenere tutti i tag aggiornati e ben funzionanti sul proprio sito.

Una gestione del genere aumenta il costo di manutenzione del tuo sito, comporta più lavoro per i tuoi sviluppatori e, pertanto, si finisce per spendere più tempo e denaro per l’implementazione e la gestione dei tag.

Ecco perché serve utilizzare Google Tag Manager, considerando che è pure gratuito e non ci sono spese mensili o annuali, quindi non hai davvero alcun motivo per non utilizzarlo.

Come funziona Google Tag Manager

Se consideriamo metaforicamente Google Tag Manager come un’auto, il suo motore è il tag contenitore, mentre la sua carrozzeria e i suoi controlli sono l’interfaccia utente.

Il tag contenitore fornisce tutte le funzionalità necessarie per eseguire e distribuire i tag sul nostro sito web.

L’interfaccia utente rende facile, per noi utenti finali, controllare e gestire i tag inseriti.

Da un punto di vista organizzativo GTM presenta la seguente struttura:

  • Account
    • Tag Contenitore
      • Tag
      • Attivatori
      • Variabili

Comprendiamo nel dettaglio ogni parte di questa struttura.

organizzazione account Google Tag Manager

Come creare un account GTM

Il primo passo per iniziare ad utilizzare GTM consiste nel creare un account gratuito.

Se disponi già di un account Google, la creazione di un account Google Tag Manager è una semplice procedura in tre passaggi:

  1. Vai all’indirizzo https://www.google.com/intl/it/tagmanager/, clicca su Accedi e loggati utilizzando le credenziali di accesso del tuo account Google (email e password);
  2. A questo punto dovrai inserire il nome dell’account (la tua società), il Paese e l’URL del tuo sito web;
  3. L’ultimo passaggio consiste nell’indicare il luogo in cui desideri utilizzare il contenitore (Web, iOS, Android, AMP). Puoi selezionare “Web” per installare il contenitore GTM sul tuo sito, cliccare sul pulsante “Crea” e, infine, accettare i termini e condizioni del servizio.

creazione account Google Tag Manager

Completati questi passaggi, ti verrà mostrato il codice per l’installazione del tag contenitore di Google Tag Manager.

Come installare il Tag Contenitore di GTM

Ogni account GTM può avere uno o più tag contenitore. Un contenitore comprende i tag di monitoraggio (ad esempio i tag di remarketing o di monitoraggio delle conversioni di AdWords) e i valori di configurazione da utilizzare sul sito o nell’app per dispositivi mobili.

La regola generale è di creare un tag contenitore specifico per ogni sito web. Quindi se hai 3 siti, dovrai creare 3 tag contenitore diversi, uno per ogni sito.

Dal punto di vista tecnico, il tag contenitore di Google Tag Manager è un tag a due parti, poiché è composto da due parti di codice, come è possibile vedere nell’immagine:

installare tag contenitore Google Tag Manager

La prima parte del tag contenitore va posizionata nella sezione head del tuo sito web:

< !-- Google Tag Manager -- >
< 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=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');< /script >
< !-- End Google Tag Manager -- >

La seconda parte del tag contenitore GTM va posizionata immediatamente dopo il tag di apertura:

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

Entrambe le parti di codice dovranno essere installate su tutte le pagine su cui vogliamo che GTM sia abilitato (di solito in tutte le pagine del nostro sito).

Una volta che il codice del tag contenitore è stato aggiunto su ogni pagina, Google Tag Manager può considerarsi installato sul nostro sito.

L’ID contenitore GTM

La parte di codice del tag contenitore composta da “GTM-XXXXXXX”, è l’ID del contenitore che ha la funzione di identificare in modo univoco ciascun tag contenitore.

L’altra parte del codice con scritto “gtm.js” fa riferimento alla libreria JavaScript utilizzata dal tag contenitore.

Per chi possiede già un account GTM, può visualizzare il codice del contenitore GTM procedendo nel seguente modo:

  1. accedere al proprio account GTM;
  2. fare clic sulla scheda “Amministrazione”;
  3. cliccare su “Installa Google Tag Manager”.

A questo punto vedrai il codice del tuo tag contenitore GTM.

Come usare Google Tag Manager

Introduzione ai Tag

GTM fornisce di default molteplici modelli di tag predefiniti. Un modello di tag semplifica la creazione di un tag sul nostro sito (in particolare di un tag di terze parti), perchésemplicemente compilare il form messo a disposizione per renderlo attivo.

Per creare un nuovo tag e visualizzare l’elenco di tutti i modelli di tag disponibili:

  1. vai nell’Area di Lavoro e posizionati su Tag;
  2. fai clic sul pulsante “Nuovo”;
  3. fai clic su “Configurazione tag”;

Ora potrai visualizzare l’elenco di tutti i modelli di tag predefiniti in GTM, dovrai sceglierne uno per poi configurarlo.

tag predefiniti Google Tag Manager

Nota bene: se desideri creare e utilizzare un tag personalizzato, è possibile farlo utilizzando il tag “HTML personalizzato” oppure “Immagine personalizzata”.

Esempi pratici di creazione e attivazione tag step by step:

Per una migliore comprensione, è consigliabile vedere gli esempi pratici linkati solo dopo aver letto tutto l’articolo.

Introduzione agli Attivatori

Un Attivatore è una condizione che deve essere soddisfatta per attivare o disattivare un tag. Praticamente indica dove e quando eseguire (o non eseguire) le istruzioni contenute nel Tag.

Gli attivatori determinano:

  • quando il tag deve o non deve essere eseguito;
  • dove il tag deve o non deve essere attivato;
  • cosa deve fare il tag quando viene eseguito.

Esistono due tipi di attivatori:

  1. Attivatori di attivazione;
  2. Attivatori di blocco;

Il primo è un attivatore che attiva il tag ogni qual volta la condizione di attivazione viene soddisfatta. Il secondo è invece un attivatore che, viceversa, impedisce l’attivazione di un tag al soddisfarsi della condizione.

Potresti ad esempio voler attivare un tag su tutte le pagine tranne che sulla pagina contatti: in questo caso occorre un attivatore di blocco del tipo “URL è uguale a /contatti/”.

Introduzione alle Variabili

Una Variabile è l’elemento che contiene il valore necessario per attivare il tag. In GTM una variabile è denotata usando la seguente sintassi:

{{Nome variabile}}

Ci sono due tipi di variabili in GTM:

  1. Variabili integrate;
  2. Variabili definite dall’utente;

Le prime sono variabili predefinite in ogni contenitore GTM e sono quelle con cui creare i tag e gli attivatori utilizzati più frequentemente. Le seconde è invece sono variabili personalizzabili in base alle proprie esigenze specifiche.

Per attivare le variabili integrate:

  • Fai clic su “Variabili” nella home page di Google Tag Manager;
  • Clicca sul pulsante “Configura”;
  • Seleziona le variabili che vuoi attivare.

Per creare una variabile personalizzata, la procedura standard è la seguente:

  • Fai clic su “Variabili” nella home page di Google Tag Manager;
  • Sotto “Variabili definite dall’utente”, fare clic su “Nuovo”;
  • Assegnare un nome alla variabile;
  • Cliccare su “Configurazione variabile”;
  • Scegliere il tipo di variabile da configurare;
  • Configurare e salvare la variabile.

Introduzione alle Cartelle

In GTM tramite le Cartelle è possibile organizzare tag, attivatori e variabili in base al nome del progetto, nome del team, nome del tool, etc.

Ad esempio, puoi raggruppare tutti i tag, attivatori e variabili relativi a “Google Analytics” creando una cartella denominata “GA” e quando dovrai modificarli potrai recarti direttamente qui, riducendo i tempi di ricerca.

Per creare e popolare una cartella:

  • andiamo in Cartelle e clicchiamo su Nuova Cartella;
  • diamo un Nome alla cartella e salviamo;
  • andiamo in “Elementi non archiviati”;
  • selezionare tag, attivatori e variabili che vogliamo inserire nella cartella;
  • clicchiamo su “Sposta” e poi sulla cartella in cui spostare gli elementi.

Nota bene: è possibile rinominare ed eliminare una cartella o aggiungere e rimuovere elementi al suo interno, in qualsiasi momento.

Introduzione al Data Layer (Livello dati)

Il Data layer è una variabile javascript riconosciuta automaticamente da Google Tag Manager che consente di passare facilmente i dati dal nostro sito a GTM e viceversa.

Il data layer contiene tutte le informazioni che si desidera inviare al tag contenitore GTM, che a sua volta trasferirà tali informazioni ad altri strumenti di terze parti, come ad esempio Google Analytics.

Esempio sintassi data layer:

< script >!
dataLayer = [{!
'color': 'black',!
'conversionValue': 50,!
'event': 'VerniceAuto'!
}];!
< /script >

Google consiglia di utilizzare un livello dati per compilare variabili e attivatori. Se non hai competenze javascript, il tuo programmatore può impostare il data layer per te.

Per ottenere il massimo da GTM, è necessario comprendere e utilizzare i data layer.

FAQ: domande frequenti su Google Tag Manager

GTM è facile da usare per chi non sa programmare?

Sì, ma solo in misura piuttosto limitata e solo per implementare monitoraggi base. Se vuoi modificare in modo significativo il modo in cui un tag viene attivato o deve comportarsi in determinate situazioni, oppure se desideri implementare monitoraggi avanzati, devi possedere una conoscenza adeguata di: HTML, DOM e JavaScript.

Molti iniziano ad utilizzare GTM su consiglio di Google o di “esperti che hanno interesse a venderti questo strumento come semplice”, ma poi si bloccano rapidamente durante l’implementazione e la configurazione dei tag.

Quando non riescono a capire cosa sta andando male, non hanno altra scelta che delegare l’utilizzo di GTM ad un esperto oppure ad agenzia esterna.

Se ti ritrovi in questa situazione, ti consiglio di dare uno sguardo al corso Google Tag Manager.

Google Tag Manager mi rende indipendente dal programmatore?

Sì, ma non completamente. Anche quando hai una conoscenza adeguata di HTML, DOM e JavaScript, avresti ancora bisogno dell’aiuto dello sviluppatore che ha realizzato il sito del tuo cliente.

Questo perché se non si ha familiarità con il linguaggio lato server, con l’ambiente di sviluppo o con il database utilizzato dal sito del tuo cliente, sarà necessario l’aiuto dello sviluppatore che lo ha realizzato per aggiungere il codice lato server ai propri data layer o per interrogare il database per i tuoi scopi.

Come posso diventare un esperto di Google Tag Manager?

Per diventare un esperto di GTM, è necessario sviluppare un’ottima conoscenza di:

  • HTML, DOM e JavaScript;
  • Ambiente degli sviluppatori di Google Analytics;
  • Conoscenza delle tecniche di DOM Scraping;
  • Conoscenza pratica delle espressioni regolari;
  • Conoscenza di un linguaggio lato server, come PHP, è un bonus.

L’utilizzo di GTM può creare problemi di tracciamento o tecnici sul mio sito?

Sì, può capitare. Ad esempio se si distribuiscono tutti i tag di marketing e di analisi tramite il tag contenitore e vi sono delle modifiche al codice del contenitore durante l’aggiornamento del tuo sito, tutto il monitoraggio può smettere di funzionare immediatamente.

Oppure quando si attiva un tag che è in conflitto con il codice del nostro sito, può facilmente interrompere o modificare alcune funzionalità del sito stesso.

Infine se gli stessi tag vengono distribuiti sia tramite GTM, sia codificati direttamente sul sito o distribuiti tramite altri strumenti di gestione tag, questo può alterare i dati raccolti.

Quindiessere molto prudenti nell’utilizzo di GTM, poiché se gestito da personale incompetente può causare diverse problematiche.

Posso usare lo stesso tag contenitore su più siti web?

Sì, ma non conviene farlo perché può creare problemi di tracciamento.

Posso distribuire il codice del tag contenitore GTM tramite un altro tag manager solution?

Sì, ma questo può impedire il corretto funzionamento di GTM. La regola generale è di non usare più di un gestore tag per applicativo.

Ci sono tag che non possono essere distribuiti con GTM?

Sì, GTM non può essere utilizzato per la distribuzione di: tag sincroni, tag in due parti e tag che non sono compatibili con GTM (come ad esempio il “Facebook JavaScript SDK”). Puoi trovare l’elenco di tutti i tag supportati a questo indirizzo.

Devo eseguire la migrazione di tutti i miei tag a GTM?

No. Tuttavia, Google consiglia di migrare tutti i tag supportati da GTM.

GTM funziona, anche se si esegue la migrazione solo di un sottoinsieme di tag?

Sì, puoi decidere arbitrariamente quali tag migrare e quali lasciare così come sono.

GTM raccoglie dati?

No, GTM non raccoglie alcun dato ma si limita a passare dati ad altri tool. Tuttavia, i tag attivati ​​tramite questo strumento potrebbero raccogliere dati (come ad esempio Google Analytics).

Qual è la differenza tra GTM e Google Analytics?

GTM è un gestore di tag che viene utilizzato per distribuire e gestire i vari tag. Google Analytics è invece uno strumento di monitoraggio di siti web e app, utilizzato per raccogliere, elaborare e generare report sui dati di utilizzo (per maggiori puoi leggere Google Analytics cos’è e a cosa serve).

Posso utilizzare GTM anche quando non utilizzo Google Analytics?

Sì. Google Tag Manager è una soluzione di gestione tag e può essere utilizzata anche per distribuire tag non relativi ai servizi Google.

Come posso distribuire i tag non Google tramite GTM?

Attraverso il tag specifico predefinito se fornito da GTM (che puoi trovare nella sezione “Altro” durante la scelta del tipo di tag) oppure tramite i tag personalizzati (HTML e Immagine).

GTM funziona su siti mobile e app mobile?

Sì, funziona su: siti web, app iOS e Android e su pagine AMP.

L’uso di GTM rallenta il caricamento del mio sito web?

Normalmente no, poiché GTM attiva i tag in modo asincrono e questo può migliorare la velocità di caricamente delle pagine del tuo sito.

Tuttavia se il tuo contenitore contiene molti tag, attivatori e variabili, allora può influire negativamente sulla velocità di caricamento del tuo sito web.

Quindi, se non stai usando un particolare tag, attivatori o variabile e non hai in programma di usarlo in futuro, rimuovilo dal contenitore.

Posso usare GTM in parallelo con snippet di altri tools?

Sì, anche se la migrazione completa di tutti i tag non è possibile. Tuttavia, devi assicurarti di non eseguire il doppio tagging, ovvero distribuire lo stesso tag due volte, una volta tramite GTM e una volta direttamente nel codice.

GTM funzionerà se lo attivo solo su alcune pagine del mio sito?

Sì, ma funzionerà solo su quelle pagine che contengono il tag contenitore.

Quale tipo di tag è più probabile che provochi malfunzionamenti al mio sito?

I tag di tipo HTML personalizzato. E’ consigliabile utilizzare i tag predefiniti se possibile, soprattutto se utilizzi da poco GTM oppure non conosci le logiche dello strumento.

Cosa significa che GTM non è influenzato dal protocollo?

Significa che funzionerà allo stesso modo sia su pagine in protocollo https che in protocollo http.

Che cos’è Google Tag Manager V2?

È la seconda e migliore versione di Google Tag Manager.

Cosa sono le API di GTM?

Tramite le API di Google Tag Manager è possibile gestire in modo programmatico: account, contenitori, autorizzazioni, tag, attivatori e variabili.

Conclusioni

In questa guida per principianti ho voluto far chiarezza su che cos’è e come funziona Google Tag Manager, sulle principali funzionalità dello strumento e sulle domande più comuni che si pone chi inizia ad utilizzare questo strumento tanto potente quanto complesso.

Per domande o chiarimenti non esitare ad utilizzare i commenti!

Commenti (3)

  • Simone Longato

    |

    Ciao Valentino, ottima guida per entrare nel mondo di Google Tag Manager.

    Qui scrivi: “Normalmente no, poiché GTM attiva i tag in modo asincrono e questo può migliorare la velocità di caricamente delle pagine del tuo sito.”

    Ho effettuato dei test per vedere la velocità di un sito che seguo lato SEO, come cambiava la velocità con GTM e utilizzando il catching con un sistema CDN c’erano effettivamente dei rallentamenti in quanto non sono all’interno del sito i vari richiami e quindi non sono ottimizzabili.
    Sicuramente è utile capire se implementando si hanno più benefici che eventuali problematiche.

    Ti è mai capitato di vedere questo tipo di rallentamenti?

    Rispondi

    • Valentino Mea

      |

      Buongiorno Simone,
      con GTM di solito si migliora il caricamento delle pagine rispetto alla gestione manuale dei tag lato codice, per via del caricamento asincrono.

      Tuttavia, come ho scritto anche nell’articolo, “se il tuo contenitore contiene molti tag, attivatori e variabili, allora può influire negativamente sulla velocità di caricamento del tuo sito”. Quindi ti confermo che può capitare di registrare abbassamenti di performance.

      In ogni caso, ritengo che vi siano sempre dei vantaggi a gestire i tag di un sito con una soluzione di gestione tag, che sia GTM o altro, per i benefici di cui ho parlato proprio nell’articolo. Quindi consiglio di utilizzarlo senza alcun dubbio.

      Buon lavoro.

      Rispondi

      • Simone Longato

        |

        Buongiorno Valentino, grazie per la risposta.
        Farò altre prove e vediamo se riesco a diminuire l’utilizzo dei tag in quel progetto.
        Buon lavoro :)

        Rispondi

Lascia un commento