Come installare Google Tag Manager sul tuo sito
Pubblicato: 2022-04-12Google Tag Manager (GTM) è un servizio gratuito che semplifica notevolmente il lavoro con i tag sui siti Web e nelle applicazioni mobili. Con GTM puoi facilmente modificare il codice sulle pagine, aggiungere nuovi frammenti e integrare il tuo sito con sistemi analitici, pubblicità e altri servizi.
Per iniziare, devi installare il codice Tag Manager sul tuo sito. Successivamente, tutte le altre impostazioni possono essere regolate nell'interfaccia di servizio senza coinvolgere i programmatori. Puoi saperne di più su Google Tag Manager e su come funziona insieme a Google Analytics nel nostro articolo. Se hai già familiarità con questo, non perdiamo tempo e procediamo all'installazione di GTM.
In breve, per installare Google Tag Manager dovrai:
- creare un account e un contenitore in Google Tag Manager;
- installa il codice di Google Tag Manager sul tuo sito;
- pubblicare il contenitore;
- controlla Google Tag Manager.
1. Crea un account e un contenitore in Google Tag Manager
Nella home page di Tag Manager, fai clic sul pulsante Registrati e accedi utilizzando il tuo indirizzo Gmail o qualsiasi altro account Google:
Ora devi creare un account direttamente in Tag Manager. Per fare ciò, fai clic su Accedi a Tag Manager :
Quindi, fai clic su Crea account :
Pensa a un nome per il tuo account: è più conveniente usare il nome della tua azienda. Quindi seleziona il Paese, seleziona la casella accanto a Condividi i dati in modo anonimo con Google e altri servizi (opzionale) e fai clic su Continua :
Ora devi configurare il contenitore. Se confronti la struttura di Google Tag Manager con la struttura di Google Analytics, il contenitore è l'equivalente di una risorsa in GA. Memorizza tag, trigger e variabili per l'intero sito. Possono esserci diversi contenitori in un account GTM: per il sito Web, per l'applicazione mobile, per le pagine AMP e così via. Per renderlo conveniente, è meglio assegnare al contenitore il nome della risorsa per cui è stato creato. Ad esempio, questo potrebbe essere l'indirizzo del tuo sito.
Dopo aver inserito il nome del contenitore, seleziona dove verrà utilizzato (nel nostro esempio, questo è Web ) e fai clic su Crea :
Leggi le regole per l'utilizzo di Tag Manager. Spunta la casella in fondo alla pagina per confermare di essere d'accordo con le condizioni di trattamento dei dati secondo il GDPR, quindi fai clic su Sì :
Successivamente, vedrai una finestra con il frammento di codice GTM che deve essere installato sul tuo sito Web:
Puoi copiare immediatamente il codice e installarlo su tutte le pagine del sito che vuoi monitorare, oppure fare clic su Ok e farlo in seguito quando aggiungi i primi tag al contenitore. Puoi visualizzare e copiare il codice in qualsiasi momento in Amministrazione → Installa Google Tag Manager :
2. Installa il codice di Google Tag Manager sul tuo sito
Se hai dimestichezza con lo sviluppo di siti web e hai accesso al pannello di amministrazione, è facile aggiungere il codice di Tag Manager. Ecco un esempio di come farlo tramite WordPress. Altrimenti, dovrai comunque chiedere aiuto ai programmatori; in caso contrario, c'è il rischio di rompere il codice sorgente della pagina.
Il codice di Google Tag Manager è composto da due frammenti e viene caricato in modo asincrono. Cioè, la parte principale della pagina continua a caricarsi senza attendere il caricamento del container GTM. La prima parte del codice va inserita nell'intestazione della pagina, il più vicino possibile al tag di apertura <head>:
Questo perché maggiore è la posizione del primo frammento, più velocemente verrà caricato. Se lo inserisci nel tag <body>, rischi di perdere i dati sugli utenti che lasciano la pagina prima di caricare questo tag.
La seconda parte del codice funziona come backup e aiuta a tenere traccia delle azioni degli utenti che hanno disabilitato JavaScript. Deve essere posizionato immediatamente dopo il tag di apertura <body>:
Importante!
Il codice GTM deve essere posizionato direttamente sulla pagina che stai per tracciare, ovvero su tutto il tuo sito. L'inserimento del codice in un iframe nascosto o l'implementazione in un altro sistema di gestione dei tag non consentirà il monitoraggio corretto dei tag nella pagina principale.
Installazione di Google Tag Manager su una pagina AMP
Se utilizzi la tecnologia AMP per caricare e adattare rapidamente le pagine per dispositivi mobili, la prima parte del codice deve essere posizionata prima del tag di chiusura </head>:
E la seconda parte del codice va inserita subito dopo il tag di apertura <body>:
3. Pubblica il contenitore
Anche se non hai aggiunto un solo tag al contenitore, ti consigliamo di pubblicarlo subito dopo aver installato il codice GTM sul tuo sito. In caso contrario, il contenitore genererà un errore 404. Questo non è critico, tuttavia. Se stai monitorando gli errori JavaScript utilizzando determinati servizi come TrackJS, gli errori 404 riempiranno i tuoi rapporti. Per non causare stress inutili agli sviluppatori, è meglio pubblicare un contenitore vuoto: non danneggia nessuno.
Per pubblicare un contenitore, vai alla scheda Area di lavoro in Tag Manager e fai clic sul pulsante Invia nell'angolo in alto a destra:
Seleziona Pubblica e crea versione . Poiché questa è la prima versione del tuo contenitore, il campo Descrizione versione può essere lasciato vuoto. Quindi, fai clic su Pubblica :
Fatto. Il contenitore è stato pubblicato.
4. Dai un'occhiata a Google Tag Manager
Dopo aver aggiunto il codice Tag Manager al tuo sito, puoi verificare se i dati vengono trasferiti correttamente utilizzando l'apposita estensione Google Tag Assistant. Questa è un'aggiunta al browser Chrome che mostra quali tag dei prodotti Google sono installati sul tuo sito e come funzionano.
Dopo aver scaricato e installato il componente aggiuntivo, vedrai questa icona nella barra degli strumenti di Chrome
. Fare clic su di esso e selezionare quali tag di sistema si desidera controllare e su quali pagine. Fare clic su Fine .
Quindi vai alla pagina che desideri controllare e fai clic sull'icona Tag Assistant. Per attivare l'estensione, fare clic su Abilita :
Aggiorna la pagina corrente e Tag Assistant mostrerà quali tag sono installati sulla pagina e come funzionano. Un'icona verde indica che i dati vengono trasmessi senza alcun reclamo, blu indica che non ci sono criticità e rossa segnala gravi problemi:
Se fai clic su un tag specifico, vedrai le possibili cause dell'errore e suggerimenti su come risolverlo:
Ulteriori informazioni su Tag Assistant sono disponibili nella Guida di Google.
Un altro paio di consigli
Quando installi il codice GTM sul tuo sito, chiedi allo sviluppatore di aggiungere contemporaneamente lo snippet di Google Optimize. Questa è una buona idea anche se al momento non hai intenzione di sperimentare il contenuto del tuo sito. Ogni volta che vuoi condurre un test A/B, tutto sarà pronto.
Questo snippet di codice è necessario per caricare il contenitore di Google Optimize in modo asincrono e non mostrare la pagina originale fino al caricamento del contenitore. Con lo snippet Optimize, gli utenti non vedranno il contenuto originale della pagina finché non verrà caricata la pagina con le modifiche nel test.
Quando trasferisci i tag che hai inserito manualmente in Google Tag Manager, non dimenticare di rimuoverli dal codice sul sito in modo che i dati non vengano duplicati. Questo è un punto importante.
Qual è il prossimo
Dopo aver installato il codice sul tuo sito, devi aggiungere e configurare tag e variabili nell'interfaccia di Tag Manager. Per sapere come farlo, consulta l'articolo Cos'è Google Tag Manager e come configurare Google Analytics con esso o il webinar Un passo avanti: tecniche e sottigliezze di lavoro con Google Tag Manager.
PS Abbiamo preparato una checklist di 20 passaggi che devono essere eseguiti dagli analisti di marketing per prendere decisioni basate su dati corretti e completi. Compila il modulo e ti invieremo via email la checklist.