Guida Base

Guida Base: Come creare Virtual Page con Google Tag Manager

[Aggiornata il 22 Febbraio 2019]

In questa semplice guida ti spiegherò come creare le Virtual Page con Google Tag Manager.

Immaginiamo di voler tracciare quando un utente clicca su un pulsante di richiesta preventivo ed appare un Dialog. La mia esigenza è quella di creare una virtual page quando l’utente apre questo Dialog.

STEP 1 – Crea l’Attivatore

Come prima cosa creiamo un Attivatore che si abilita al click del pulsante che apre il Dialog.

  • Nel menu a sinistra clicca su Attivatori > Nuovo > Configurazione attivatore.
  • Tipo di attivatore: Clic – Tutti gli elementi.
  • Si attiva su: Alcuni clic.
  • Aziona l’attivatore quando: Click Text è uguale a RICHIEDI L’ANTEPRIMA GRATUITA (naturalmente tu personalizzalo a seconda del tuo pulsante)*
  • Rinomina l’Attivatore – nel mio caso “Modal Anteprima Libro”– e salvalo.

*Click Text è 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

STEP 2 – Crea il Tag

Adesso invece andremo a creare il Tag:

  • Tag > Nuovo > Configurazione tag.
  • Tipo di tag: Universal Analytics.
  • Tipo di monitoraggio: Visualizzazione di pagina.
  • Aggiunti la Variabile delle Impostazioni di Google Analytics oppure abilita l’override e poi inserisci nel campo ID Monitoraggio la costante GA {{gaID}} che dovresti avere già creato se segui le mie guide, oppure il tuo codice UA di Google Analytics.
  • Ora vai su Altre impostazioni > Campi da impostare.
  • Aggiungi un nuovo campo.
  • Nome: page.
  • Valore: nel mio caso ho inserito {{Page Path}}download-anteprima-libro ma tu puoi impostare  l’URL che ritieni più opportuno.
  • Associa l’Attivatore creato in precedenza. In questo caso “Modal Anteprima Libro”.
  • Dai un nome al Tag, ad esempio “GA – Virtual PageView – Modal Libro” e salva.

STEP 3 – VERIFICA IL TAG

Come al solito, prima di pubblicare il Tag possiamo verificare prima che funzioni in modo corretto, grazie alla Modalità di Anteprima e Debug offerta da Google Tag Manager.

Attivala e va sulla pagina del tuo sito in cui è presente il pulsante della Virtual Page. Adesso dovresti vedere il Tag fra i Tags Not Fired On This Page.

Se invece scateni l’evento cliccando sul pulsante, il Tag dovrebbe ora passare fra i Tags Fired On This Page.

Ecco, se è andata esattamente così, vuol dire che il Tag funziona. Puoi procedere ora alla pubblicazione cliccando sul pulsante blu “Invia”.

Come, già finito?

Sì, già finito.

Immagina di utilizzare questa opzione per siti di tipo One Page o il checkout di un sito e-commerce. Potente, no?

A presto e buon Tag!

Matteo Zambon

View Comments

  • Ciao Matteo,
    ho il tuo medesimo problema, ho un form dove vengono raccolte le leads ed una modale anzichè una thank you page. Sto seguendo i passi che hai indicato ma nel punto in cui imposti il nome del campo ed il valore mi perdo.
    Non riesco ad impostarlo. Riesci ad aiutarmi gentilmente, sono bloccata e non riesco ad andare avanti. Il valore denominato Page Path-download-anteprima-libro come lo generi?
    Grazie mille
    Vincenza

    • Ciao Vincenza, lo impongo io. Semplicemente decido che il percorso virtuale (e quindi che non esiste) sarà {{Page Path}}/download-anteprima-libro/
      Tu puoi tranquillamente mettere quello che vuoi :)

  • Ciao, come tracciare i pdf che un utente trova magari facendo una ricerca da Google? Non provengono da click di link interni ad una pagina, ma sono indicizzati come elementi autonomi.
    E' possibile tracciarli in Analytics per averne i dati, come se fossero pagine virtuali?

  • Ciao Matteo,
    ho seguito tutte le istruzioni e devo dire che funziona tutto egregiamente.
    Il mio dubbio è il seguente: nel momento in cui devo erogare un tag soltanto nello step 1 riesco a farlo tramite un trigger basato sull'evento personalizzato e la url che passo nel datalayer. Quando, però, passo allo step2 e poi al 3 e così via il tag erogato allo step1 è ancora visibile nel debug, non scompare! Perchè si verifica questo? Può comportare errori di tracciamento? Io vorrei che dopo essersi attivato allo step1 scompaia (nel debug) in corrispondenza delle altre virtual page, grazie :)

    • Ciao Matteo,
      grazie per la celere risposta!
      Il tag si attiva solo la prima volta: mentre gli altri tag che scattano sempre incrementano il "Fired time(s)" ad ogni nuova virtual page, in questo caso risulta Fired 1 time. Inoltre, nei tag che scattano alla seconda virtual page non ritrovo il mio tag ma lo ritrovo solo nella summary.
      Il dubbio che ti ho posto però sorge perchè ho notato questo comportamento: se vado a controllare il valore del tag nel "Summary" non ritrovo il valore dinamico associato allo step 1, dove è stato erogato, ma quello relativo allo step 2. Così se per esempio allo step 1 assegno il valore 1, allo step 2 il valore 2 e così via io mi aspetto che il mio tag mantenga il valore 1 essendo scattato solo allo step1 e non che aggiorni il suo valore con 2. è corretto questo comportamento? Può causare qualche problema? Grazie ancora :)

    • Ciao Paola,

      nella console di debug rimangono i tag che si sono attivati (a meno che la pagina non venga ricaricata), bisogna capire se si attiva davvero nello stesso evento, o se rimane nella scheda "summary"della console.

      Fammi sapere :)

  • Ciao, perchè a me la schermata dello step 2 è completamente diversa (e in particolare non mi consente di vedere e quindi compilare le "ulteriori impostazioni")? Mi hanno dato la versione taroccata di GTM o cosa :)?

  • Grazie mille Matteo,
    ho risolto con gli “strumenti per sviluppatori” su Chrome.

    a presto
    Vincenzo

  • Ciao Matteo,
    mi chiedevo se c'è un modo con GTM (magari con anteprima
    o debug) per visualizzare il sorgente HTML che, in un determinato
    istante, è associato ad una pagina, per via delle modifiche che
    quest'ultima può aver subito in quell'istante ad opera dei vari java script.

    Ti ringrazio
    Vincenzo

    • Ciao Vincenzo, di default GTM non tiene lo storico HTML dei vari passaggi, forse qualche estensione esiste ma sinceramente non ne conosco. Se hai bisogno di questo per debuggare posso suggerirti di usare gli "strumenti per sviluppatori" (su Chrome). Da lì puoi vedere tutte le chiamate e varianti in HTML.

      A presto!

Recent Posts

Caso studio: LUISAVIAROMA ottimizza il tracciamento dei dati Ecommerce e le performance Advertising grazie GA4 e BigQuery

LUISAVIAROMA è uno dei principali fashion e-tailer di lusso al mondo, con oltre 5 milioni…

9 ore ago

Caso studio: Mondo Convenienza realizza +85% di vendite ecommerce e +100% di conversioni aggiuntive per le campagne Meta Ads grazie GA4 e Server-Side Tracking

All’interno del vasto e competitivo mercato della Grande Distribuzione Organizzata (GDO), Mondo Convenienza rappresenta uno…

2 giorni ago

Come creare un report in GA4 per analizzare il funnel di conversione di un sito web o ecommerce

Se ti occupi di marketing o advertising, saprai che i funnel rappresentano il percorso che…

1 settimana ago

Attribuzioni errate in GA4: cause e soluzioni al problema

Negli ultimi mesi hai notato in Google Analytics 4 un calo improvviso e inspiegabile nelle…

4 mesi ago

Come creare una Dashboard Ecommerce per analizzare i dati degli acquisti Nuovi e di Ritorno

Se ti trovi su questa guida è perché hai compreso che solo attraverso la Data…

5 mesi ago