Hai mai pubblicato un tag su Google Tag Manager e qualche ora dopo il tuo e-commerce non tracciava più gli acquisti? O peggio, il form di contatto smetteva di funzionare? Noi di Meteora Web lo vediamo almeno una volta al mese nei progetti che ci arrivano: un tag di remarketing attivato su tutte le pagine perché il trigger era 'Page View' invece di un evento specifico. Risultato: dati sporchi, sessioni gonfiate, e utenti che abbandonano. Il rimedio si chiama GTM Preview e Debug, una modalità integrata che ti permette di vedere esattamente cosa fa ogni tag prima di mandarlo in produzione. In questa guida ti mostriamo come usarla per non rompere nulla.
Perché è così facile rompere il sito con Google Tag Manager?
GTM è uno dei tool più potenti per la gestione del tracking, ma proprio per la sua flessibilità è anche uno dei più pericolosi se usato senza test. Un trigger sbagliato, una variabile undefined, un codice JS che blocca il rendering: basta un errore per mandare in crash parti critiche del sito. Noi lo abbiamo visto su clienti che avevano il pulsante 'Aggiungi al carrello' che non rispondeva più perché un tag di terze parti aveva sovrascritto una funzione jQuery. Senza Preview, quel bug sarebbe rimasto nascosto fino alla prima segnalazione del cliente.
Il vero problema: pubblicare un tag mai testato
La tentazione è forte: crei un tag, imposti un trigger 'All Pages', clicchi su Pubblica e via. Il problema è che GTM non ha un 'compilatore' che ti dice se il tag è corretto. Un errore di sintassi in un Custom HTML tag manda giù la pagina, ma GTM lo pubblica lo stesso. Per questo la regola numero uno di chi lavora con il tracking è: nessun tag va pubblicato senza prima averlo testato in Preview.
Cosa succede quando un tag si attiva sulla pagina sbagliata
Esempio concreto: un tag di Facebook Pixel con trigger 'Page View' su tutte le pagine. Sembra innocuo, ma se hai una pagina 'Grazie per l’acquisto' che viene visitata anche da utenti che non hanno comprato, il Pixel registrerà conversioni false. Oppure un tag di Google Ads con trigger 'Click' su un link che non è ancora stato caricato: il tag non si attiva e perdi i dati. La Preview ti mostra in tempo reale se, quando e dove si attiva ogni tag.
Sponsored Protocol
Come funziona la modalità Preview di GTM?
La Preview è una funzionalità integrata di GTM che ti permette di collegare una sessione del tuo browser a una specifica versione del contenitore. In pratica, quando attivi la Preview, GTM crea un URL speciale con un parametro gtm_auth e gtm_preview che dice al container di caricare la versione in bozza invece di quella pubblicata. Tu continui a navigare il sito normalmente, ma nel pannello di debug vedi tutto ciò che accade: quali tag si attivano, quali no, i valori delle variabili e del Data Layer.
Attivare la Preview: due clic, nessun rischio
Apri GTM, clicca sul pulsante 'Anteprima' in alto a destra. Si apre una nuova scheda con il tuo sito. Inserisci l’URL della pagina che vuoi testare (es. la homepage o la pagina prodotto) e clicca 'Start'. Da quel momento, per la durata della sessione (fino a 24 ore o fino a che non chiudi la scheda), GTM caricherà la versione in bozza del contenitore. Attenzione: se non chiudi la scheda preview, gli altri visitatori vedono ancora la versione pubblicata — la Preview è personale e non influisce sugli altri utenti.
L'interfaccia di debug: cosa vedere e cosa ignorare
Il pannello di debug si apre di solito in basso (o come popup a sinistra su schermi grandi). È diviso in tre sezioni principali:
- Summary (riepilogo): mostra lo stato attuale — se la Preview è attiva e per quanto tempo.
- Tags (tag): elenca tutti i tag presenti nel contenitore, con l’indicazione se si sono attivati (verde), non attivati (grigio) o se hanno generato errori (rosso).
- Variables (variabili): mostra i valori correnti delle variabili integrate e personalizzate, aggiornati a ogni evento.
- Data Layer: la vera miniera d’oro. Qui vedi i push del Data Layer in tempo reale, con tutti i valori delle variabili
ecommerce,pageCategory, ecc.
Cosa ignorare? La sezione 'Timers' e 'History' raramente serve ai test di base. Concentrati su Tags attivati e Data Layer.
Variabili, Data Layer e attivazione dei tag in tempo reale
Uno degli usi più potenti della Preview è verificare che il Data Layer contenga i dati che ti aspetti. Esempio: hai un trigger 'Custom Event' chiamato add_to_cart. In Preview, aggiungi un prodotto al carrello. Subito nel pannello Data Layer vedi spuntare un nuovo push con event: 'add_to_cart' e i dettagli del prodotto. Se non compare, significa che il codice che genera l’evento non funziona o non è ancora implementato. Allo stesso modo, cliccando sulla riga del tag attivato, vedi quali condizioni del trigger sono state soddisfatte. Questo ti permette di capire al volo se il tag si attiva al momento giusto o se ha bisogno di un affinamento.
Sponsored Protocol
// Esempio di push Data Layer che compare in Preview
dataLayer.push({
event: 'add_to_cart',
ecommerce: {
currencyCode: 'EUR',
add: {
products: [
{ id: 'SKU123', name: 'Scarpe Running', price: 89.99, quantity: 1 }
]
}
}
});
Quali sono gli errori più comuni che emergono solo in Preview?
Abbiamo accumulato anni di errori visti in Preview. Ne elenchiamo tre che si ripetono più spesso.
Tag che si attivano su tutte le pagine invece che su una specifica
Hai creato un tag per il Pixel di Facebook e lo hai associato al trigger 'All Pages'. Sembra corretto. Ma poi in Preview navighi su una pagina di ringraziamento e vedi che il tag si attiva anche lì, quando invece volevi che si attivasse solo su una pagina specifica (es. solo la homepage). Il problema è che il trigger 'All Pages' è troppo generico. In Preview, controlla sempre il nome del tag e il trigger associato: se vedi un tag che non dovrebbe attivarsi su quella pagina, modifica il trigger aggiungendo condizioni (es. Page Path equals /grazie).
Variabili che restituiscono undefined
Un classico: crei una variabile personalizzata 'Product Price' basata su un elemento DOM (data-price). La usi in un tag di Google Ads. In Preview, il tag non si attiva. Vai nella sezione Variables e scopri che il valore è 'undefined'. Perché? Magari l’elemento non esiste ancora al momento del trigger (caricamento asincrono) o il selettore CSS è sbagliato. La Preview ti mostra subito il valore nullo, così puoi correggere la variabile prima che il tag vada in produzione.
Trigger mal configurati: l'esempio dei link click
Volevi tracciare i click su un bottone 'Scarica Subito'. Crei un trigger 'Click - Just Links' e imposti 'Click Classes' equals 'btn-download'. In Preview, clicchi sul bottone ma il tag non si attiva. Il motivo? Il selettore 'Click Classes' funziona solo se l’elemento è un link (<a>), non un pulsante (<button>). Se il tuo bottone è un <button>, devi usare 'Click - All Elements' e poi filtrare per 'Click Classes'. La Preview ti fa vedere che il trigger non scatta, quindi correggi subito.
Sponsored Protocol
Come simulare un utente reale con la Preview senza sporcare i dati?
Un dubbio comune: se attivo la Preview e faccio un acquisto di prova, il dato finisce in Google Analytics? La risposta è: dipende. Quando la Preview è attiva, GTM invia i tag esattamente come farebbe in produzione. Quindi se il tuo tag di conversione è incluso nella versione in bozza, la conversione verrà registrata. Per evitare di sporcare i dati, esistono due accorgimenti:
- Usa il tag 'Preview' come flag: aggiungi una variabile 'Debug Mode' che restituisce true solo quando sei in Preview, e usala per escludere i tag di conversione in fase di test (con un blocco 'Debug Mode equals false').
- Non inviare conversioni reali: per testare un evento di acquisto, usa un ambiente di staging o un tag con un ID di tracciamento fittizio (es. un UA di test).
The preview window and its limitations
Il pannello di debug offre anche una comoda finestra che mostra il 'flusso' degli eventi. Puoi vedere in che ordine si attivano i tag. Una limitazione: la Preview non funziona su domini diversi dal tuo. Se il tuo sito ha un checkout esterno (es. su un subdomain o su PayPal), devi attivare la Preview anche su quel dominio (aggiungendolo nelle impostazioni del contenitore).
Test con dispositivi mobili e browser diversi
La Preview è legata al browser in cui l’hai attivata. Per testare su mobile, apri la Preview sul computer, poi usa il comando 'Preview on device' (l’icona del telefono) e scansiona il QR code con il cellulare. La sessione di debug si trasferisce. Consiglio: testa sempre almeno Chrome e Safari su iOS, perché i tag di terze parti (come Facebook) possono essere bloccati dai cookie tracker.
Sponsored Protocol
Come verificare i valori del Data Layer
Nella sezione Data Layer del pannello, ogni volta che si verifica un evento (click, invio form, Page View) vedi un nuovo push. Puoi espandere ogni push per vedere tutte le variabili. Noi usiamo sempre questa vista per controllare che il nome dell’evento corrisponda a quello che il trigger si aspetta. Inoltre, se hai un tag che usa una variabile Data Layer come {{DLV - productId}}, in Preview vedi se quella variabile ha il valore corretto.
Cosa fare quando la Preview non mostra il tag? Diagnosticare i problemi
Succede: attivi la Preview, navighi, ma il tag che stai testando non appare né come attivato né come non attivato. È come se il tag non esistesse. Ecco i passi per capire cosa sta succedendo.
Controllare la versione pubblicata e la modalità Anteprima
La Preview carica la versione in bozza (l’ultima versione non pubblicata). Se hai già pubblicato la versione, e poi hai fatto modifiche, assicurati di aver salvato una nuova versione (anche se non pubblicata). GTM spesso dà per scontato che si voglia testare l’ultima versione, ma a volte per un bug l’anteprima si aggancia alla versione pubblicata. Per sicurezza, dalla schermata di Preview clicca su 'Version' e scegli 'A draft version'.
Il debug della console: errori JS, CORS, Content Security Policy
Apri la console del browser (F12) e cerca errori. Un errore JS dentro un Custom HTML tag può bloccare il caricamento della GTM stessa. Un errore CORS può impedire a GTM di caricare il container. Controlla anche la console di rete: il file gtm.js viene caricato? Se il server risponde 404, il tag non esiste. Noi abbiamo risolto casi in cui un firewall aziendale bloccava il caricamento di GTM perché l’URL non era nella whitelist.
Utilizzo del Tag Assistant di Google come alternativa
Se la Preview non parte, un’alternativa è il Tag Assistant (estensione Chrome di Google). Tag Assistant ti mostra tutti i tag Google presenti sulla pagina (GTM, GA4, Ads) e il loro stato. Non è potente come la Preview (non mostra il Data Layer), ma può aiutare a diagnosticare se GTM è presente o meno. Noi lo usiamo come check rapido quando sospettiamo che la Preview non funzioni perché il container non viene caricato.
Sponsored Protocol
Preview avanzata: test di più versioni e confronto
Una feature poco nota ma utilissima: puoi confrontare l’esecuzione dei tag tra due versioni diverse del contenitore. Ad esempio, hai una versione 1 con tag T1 e una versione 2 con tag T1 modificato. Attivi la Preview sulla versione 2, ma vuoi vedere se il comportamento differisce dalla versione 1. GTM non lo fa nativamente, ma puoi usare due schede separate con Preview attivate su versioni diverse, oppure usare la console per stampare i valori.
A/B test dei tag con preview multiple
Per test rapidi, puoi creare una copia del tag, modificarne i parametri, e nella Preview vedere quale dei due si attiva. Attenzione ai nomi duplicati: meglio usare nomi univoci tipo 'Tag test A' e 'Tag test B'. Noi usiamo questa tecnica per verificare se un trigger basato su CSS selector funziona meglio di uno basato su attributo data-*.
Confronto tra contenitori e ambienti
Se hai più contenitori (es. produzione, staging, test), la Preview funziona solo sul contenitore che hai aperto. Per confrontare il comportamento di due contenitori su uno stesso sito, devi attivare due Preview separate (complicate). Più semplice: pubblica le modifiche in un ambiente di staging e testa lì senza Preview, oppure usa la funzione 'Environments' di GTM per creare un ambiente di test con ID container diverso.
Cosa fare adesso
Non pubblicare mai un tag senza aver prima attivato la modalità Preview. Questa regola da sola ti evita il 90% delle rogne con il tracking. Mettila in pratica subito:
- Apri il tuo contenitore GTM e clicca su 'Anteprima'.
- Naviga sul sito e verifica almeno un tag di Page View e un evento personalizzato (click o form).
- Controlla che le variabili non siano undefined.
- Se trovi un errore, correggi il tag e ripeti il test.
- Una volta soddisfatto, pubblica la versione.
Per approfondire tutto il mondo GTM, leggi la nostra Pillar Guide su Google Tag Manager. E se vuoi capire come il tagging pulito migliora i dati di vendita, dai un’occhiata al nostro articolo su Display Advertising per PMI.
