Come tracciare le pagine virtuali: Google Tag Manager e Google Analytics

In questo post vediamo come tracciare le Pagine Virtuali con l’ausilio di Google Tag Manager e Google Analytics.

Se non sai cosa sono le Pagine Virtuali o Virtual Pages e saperne di più su come ti possono aiutare soprattutto se stai tracciando una Single Page Application, ti consiglio di leggere il mio post dedicato.

Per seguire meglio i diversi passaggi che farò, immaginiamo una situazione: voglio implementare le pagine virtuali all’interno di un funnel di sellout.

Il mio funnel si comporta in questo modo:

Step 1: l’URL che si carica è www.example.com/product123#/account
Step 2: l’URL che di carica è www.example.com/product123#/order
Step 3: l’URL che si carica è www.example.com/product123#/shipping
Step 4: l’URL che si carica è www.example.com/product123#/thank-you

Per default, in Google Analytics non sono in grado di raccogliere i valori dopo il simbolo # (account, order, shipping, thank-you).

Per questo motivo ho bisogno di creare una pagina virtuale in ogni step del checkout.

Iniziamo!

Pagine Virtuali: creare un nuovo tag

I passaggi da fare all’interno di Google Tag Manager sono i seguenti:

1. Creare un nuovo tag, cliccando su Tag > New

2. Selezionare il tipo di tag (selezioniamo il tag Google Analytics: Universal Analytics)

3. Selezioniamo la tipologia di hit per questo tag: scegliamo la hit di tipo pageview

4. Selezioniamo la variabile di Google Analytics (ti rimando a questo post che descrive come creare la variabile unica per la proprietà di Google Analytics), in modo da inviare le informazioni alla proprietà che ci interessa.

5. Selezioniamo la voce Enable overriding settings in this tag e clicchiamo su More Settings > Fields to set.

6. In questo campo andremo a creare la nostra pagina virtuale inserendo la pagina che vogliamo creare e il titolo della stessa. clicchiamo su Add Field e scrivi all’interno ‘page’, mentre nel blocco “Value” inseriamo il percorso della pagina che vogliamo creare: io utilizzerò ‘/step-1-account’

7. Ora dobbiamo inserire un altro campo per dare un Titolo a questa pagina virtuale. Clicca su Add Field e inserisci ‘title’ e nel blocco “Value” il titolo che vuoi dare alla pagina: io scriverò ‘Checkout Step 1- Account’ per riconoscere che è il primo step del checkout.

titolo della pagina virtuale in tag manager

8. Diamo un nome al nostro tag.

Recap: abbiamo creato il tag e inserito il percorso della pagina virtuale e il suo titolo. Inoltre abbiamo selezionato la variabile di Google Analytics per indicare verso quale tool inviare l’informazione.

Proseguiamo inserendo il trigger per attivare il nostro tag in determinate condizioni.

Pagine virtuali: creare un nuovo trigger

Ora dobbiamo creare il trigger in modo da attivare il tag in certe situazioni.

In questo caso molto dipende dal tipo di sito web che stai tracciando e quando vuoi attivare il tuo tag. Le indicazioni di seguito sono indicative e possono variare a seconda di quello che vuoi tracciare nel tuo caso.

Come detto sopra, voglio inviare la mia pagina virtuale quando l’utente si trova nel primo step del funnel di sellout che, nel mio esempio era in questo URL: www.example.com/product123#/account.

1. Creo il mio trigger di tipo History Change

2. Seleziona la voce Some History Changes:

3. Ora selezioniamo la voce Choose Built-in Variabile dall’elenco:

4. Cerchiamo dall’elenco la variabile che si chiama New history Fragment

5. Selezioniamo la variabile per abilitarla e renderla disponibile in futuro in Google Tag Manager e all’interno del campo valore inserire la voce ‘/account’ che è presente all’interno dell’URL, in modo che GTM potrà leggere il valore dopo il simbolo #

6. Diamo un nome al trigger e salviamo:

Recap: abbiamo associato al nostro tag il trigger per leggere il valore dell’URL presente dopo il simbolo #.

Ora salviamo e testiamo il tutto.

Questo processo deve essere fatto per tutte le pagine del sellout che vogliamo tracciare e in cui vogliamo inserire delle pagine virtuali.

Se riprendo il mio esempio iniziale, questo significa che in ognuna di queste pagine del sito, verrà sparata al seguente pagina virtuale:

Step 1: pagina del sito www.example.com/product123#/account –> pagina virtuale creata in GTM: /step-1-account
Step 2: pagina del sito www.example.com/product123#/order –> pagina virtuale creata in GTM: /step-2-order
Step 3: pagina del sito www.example.com/product123#/shipping –> pagina virtuale creata in GTM: /step-3-shipping
Step 4: pagina del sito www.example.com/product123#/thank-you –> pagina virtuale creata in GTM: /step-4-thank-you

Per ogni pagina deve essere creato un tag e trigger come descritto sopra.

Pagine Virtuali: creare un Obiettivo in Google Analytics

Ora che abbiamo creato i tag e trigger, verrà creata una pagina virtuale in ogni pagina del sito web del funnel di checkout.

Adesso ci è possibile utilizzare queste pagine virtuali per creare un nuovo obiettivo in Google Analytics.

Lo scopo di questo Obiettivo può essere quello di mostrarci ogni volta che un utente arriva alla Thank you page passando in ogni pagina del funnel.

In questo caso, dobbiamo andare nelle Impostazioni di GA e, all’interno della Vista in cui desideriamo impostare l’obiettivo, creare un nuovo Obiettivo di Destinazione.

Ecco come fare. Creiamo un nuovo Obiettivo nella vista di GA.

Selezioniamo un template di tipo Custom e diamo un nome parlante all’obiettivo, ad esempio: “Checkout Completed”

Selezioniamo come tipologia di Obiettivo la Destination. Questo significa che il mio obiettivo sarà completato se viene raggiunta la destinazione che indicheremo.

obiettivo di destinazione google analytics

Clicchiamo su Continua e inseriamo diverse informazioni:

la pagina di destinazione, ossia la thank-you page che deve essere raggiunta dall’utente per completare l’Obiettivo
attiviamo la voce Funnel
Inseriamo il nome della Pagina (il valore “title” scritto nel Tag di GTM nei passaggi precedenti)
Inseriamo l’URL della pagina virtuale che abbiamo creato (il valore “page” scritto nel tag di GTM)