Enhanced Ecommerce: come configurare l’Ecommerce Avanzato di Google Analytics

Se gestisci un Ecommerce avere a disposizione un buon strumento analitico per il tuo negozio digitale ti permette di avere accesso a tendenze, rapporti e statistiche riguardanti il comportamento di acquisto degli utenti. Questi numeri ti possono guidare verso decisioni valide, quasi scientifiche, all’opposto di decisioni basate su bias cognitivi.

Puoi misurare metriche semplici come fonti di traffico, località, pagine più visitate e transazioni.
Ma puoi andare molto in profondità e tracciare le interazioni con i prodotti, l’aggiunta e la rimozione dal carrello di specifici prodotti, in che punto del processo di checkout avvengono gli abbandoni più frequenti.

Avere un buon strumento analitico per il tuo Ecommerce, dunque, può fare la differenza fra il successo e il fallimento del tuo business online. Praticamente indispensabile!

In questo articolo ti come configurare il più diffuso strumento di analisi nel web, Google Analytics, e il suo add-on dedicato all’Ecommerce, ovvero Enhanced Ecommerce, o Ecommerce avanzato. Iniziamo.

Sommario della guida

Requisiti per l’installazione

Per configurare Enhanced Ecommerce avrai bisogno di:

  • avere Google Tag Manager installato nel tuo sito web
  • avere Google Analytics installato nel tuo sito web, preferibilmente tramite Tag Manager

Abilitazione dell’opzione Enhanced Ecommerce a livello vista

Il primo passo è quello di predisporre Google Analytics a prepararsi ad accogliere i dati Ecommerce, in modo da mostrarli poi nei report dedicati.

Per attivare l’enhanced ecommerce in Google Analytics è necessario abilitare le opzioni relative all’Ecommerce. Puoi farlo da Amministrazione > Vista > Impostazioni Ecommerce. Qui dovrai attivare le opzioni Abilita Ecommerce e Abilita rapporti Ecommerce avanzato.

Nella vista verranno abilitati dei nuovi report, disponibili in Conversioni > Ecommerce.

Nota bene

Quali sono le differenze fra Ecommerce e Ecommerce avanzato in Analytics? Il pacchetto Ecommerce traccia solamente le transazioni, mentre l’Ecommerce avanzato ha diversi measurement points (add/remove to cart, checkout steps, product click/impression etc).

Creare le checkout label (opzionale)

Direttamente dallo stesso menù puoi creare le label, o etichette, corrispondenti ad ogni step del checkout del tuo Ecommerce. Questa configurazione è opzionale ma consigliata, in quanto ti permetterà una lettura completa del report

Per ora limitati a dare una nomenclatura chiara agli step, vedremo in un secondo momento come comunicare ad Analytics quale pagina effettiva corrisponde ad ogni step nel report.

Creazione del Data Layer

Lo step successivo è la creazione del Data Layer

Il Data Layer è una collezione di dati riguardanti una pagina web; questi dati sono organizzati in un array Javascript, disponibile al sistema di Tag Management

Ci sono precise istruzioni dettate dai vendor dei sistemi di Tag management che regolano come deve essere popolato un Data Layer. Nei prossimi paragrafi vedremo:

  • come popolare correttamente un Data Layer per Ecommerce tramite plugin per cms
  • come popolare correttamente un Data Layer per Ecommerce tramite codice

Popolazione del Data Layer tramite plugin

Esistono diversi plugin per generare automaticamente il Data Layer senza scrivere una riga di codice. Naturalmente, a seconda del CMS utilizzato, avrai bisogno di un plugin differente. Nelle prossime righe troverai i plugin per i principali sistemi.

Data Layer e Woocommerce

Il plugin più consigliato per la generazione automatica del data layer su Woocommerce di WordPress è Google Tag Manager for WordPress, che vi permette di valorizzare il data layer con dati di prodotto, post, login, form e molto altro.

Data Layer e Magento

Magento mette a disposizione una add-on in linea con il W3C che espone il data layer mettendo a disposizione dati riguardanti dettagli di pagina, utente e prodotto (titolo, SKU, immagini, dettaglio di prezzo e categoria). 

Data Layer e Shopify

Per rendere automatica la creazione del data layer su Shopify, fra i plugin più noti troviamo Google Tag Manager Suite. Questa app espone tutti i dati necessari per un completo tracking dell’ecommerce in Analytics.

Data Layer e Prestashop

Infine, anche Prestashop ha un suo plugin a pagamento, Google Tag Manager Enhanced Ecommerce (UA) – PRO.

Questi plugin svolgono tutti lo stesso sporco lavoro: popolano il data layer con i dati Ecommerce. Vedremo a breve come accedere a questi dati tramite Google Tag Manager.
Se invece sei interessato a popolare il Data Layer tramite codice, leggi il prossimo capitolo.

Popolazione del Data Layer tramite codice

Nel caso di esigenze avanzate o un sito web con CMS custom puoi popolare il Data Layer tramite codice valorizzandolo con i dati di livello applicazione.
Una volta che il dato è stato inserito del Data Layer sarà possibile salvarlo in una variabile Google Tag Manager, per utilizzarlo poi nei vari tag o per valorizzare una dimensione o metrica personalizzata.

Qui sotto potrete trovare gli esempi che utilizzo con gli sviluppatori quando ho necessità di popolare il Data Layer senza basarmi su un plugin. I valori associati alle chiavi sono da intendersi a mero titolo di esempio: gli sviluppatori dovranno sostituire questi valori con le istruzioni in linguaggio backend per recuperare i valori necessari dal database del sito.
Questi script, solitamente, devono essere caricati prima dello script di Tag Manager, in modo che il Data Layer sia popolato prima dell’evento di Page view (ma possiamo anche mandarli ad Analytics in eventi successivi).

Carica il plugin Ecommerce Avanzato

Il primo passo è quello di caricare il plugin di Ecommerce avanzato; per farlo è necessario installare uno snippet di codice aggiuntivo. Questo snippet va caricato dopo il codice standard di analytics e prima di qualsiasi funzionalità specifica legata all’Ecommerce avanzato.

ga('require', 'ec');

Data layer: Product impression

Le impressioni di prodotto vengono raccolte quando l’utente visualizza i prodotti nelle liste del sito, come ad esempio una specifica categoria o risultati della ricerca. Fondamentale inserire il campo ‘list’​.


var​ dataLayer​ = ​window​.​dataLayer​ || ​​[];​
dataLayer​.​push​({
    'event'​: ​​ 'eec.listing',
    ​'ecommerce'​: ​​{​
        'currencyCode'​: ​​ 'EUR'​,
        ​'impressions'​: ​​[{​
                'name'​: ​​ 'Insulated bottle - A589'​, 
                'id'​: ​​ '2934865'​,
                'brand'​: ​​ 'Polar'​,
                'variant'​: ​​ 'A589'​,
                'category'​: ​​ 'Bottles'​,   ​
                'list'​: ​​ 'Thermal bike bottles'​, ​
                'position'​: ​​1​,
                'price'​: ​​ '9.99'    ​
        }]​
    }
});

Data layer: Product click

I click di prodotto vengono raccolti quando l’utente clicca un prodotto contenuto in una specifica lista di prodotti. Fondamentale inserire il campo ‘list’​.

var​ dataLayer​ = ​window​.​dataLayer​ || ​​[];​
dataLayer​.​push​({​
    'event'​: ​​ 'eec.productClick'​,
    'ecommerce'​: ​​{​
        'click'​: ​​{​
            'actionField'​: ​​{​
                'list'​: ​​ 'Thermal bottles'​
            },
            'products'​: ​​[{​ 
                'id'​: ​​ '2934865'​,
                'name'​:​ ​'Insulated bottle - A589'​,​ ​​
                'brand'​:​ ​'Polar'​,
                'variant'​: ​​ 'A589'​, ​ 
                'category'​: ​​ 'Bottles'​, ​ 
                'price'​: ​​ '14.99'​
            }]​
        }
    },
    ​'eventCallback'​:​ ​'laTuaFunzione'
});

Data layer: Product detail

Il dettaglio di prodotto viene raccolto quando l’utente visualizza il dettaglio di prodotto, per esempio durante la visualizzazione di un anteprima di prodotto oppure durante la visualizzazione di una pagina prodotto.

var​ dataLayer​ = ​window​.​dataLayer​ || ​​[];​
dataLayer​.​push​({​
    'event'​: ​​ 'eec.productClick'​,
    'ecommerce'​: ​​{​
        'detail'​: ​​{​
            'actionField'​: ​​{​
                'list'​: ​​ 'Thermal bottles'​
            },
            'products'​: ​​[{​ 
                'id'​: ​​ '2934865'​,
                'name'​:​ ​'Insulated bottle - A589'​,​ ​​
                'brand'​:​ ​'Polar'​,
                'variant'​: ​​ 'A589'​, ​ 
                'category'​: ​​ 'Bottles'​, ​ 
                'price'​: ​​ '14.99'​
            }]​
        }
    },
    ​'eventCallback'​:​ ​'laTuaFunzione'
});

Data layer: Promotion Impression

Le impressioni di promozione vengono raccolte quando l’utente visualizza una promozione nel sito web, tipicamente un banner.

var​ dataLayer​ = ​window​.​dataLayer​ || ​dataLayer​.​push​({​
    'ecommerce'​: ​​{​
        'event'​: ​​ 'eec.promotionImpression'​, 
        'promoView'​: ​​{​
            'promotions'​: ​​[{​ 
                'id'​: ​​ 'thermal-bottles-promo'​, ​​ 
                'name'​:​ ​'Hot summer'​,​
                'creative'​:​ ​'hot_summer_0985.jpg'​,
                'position'​: ​​1
            }​]
        }​
    }​
});

Data layer: Promotion click

I click su una promozione vengono raccolti quando l’utente clicca una promozione nel sito web, tipicamente un banner.

var​ dataLayer​ = ​window​.​dataLayer​ || ​dataLayer​.​push​({​
    'event'​: ​​ 'eec.promotionClick'​, 
    'ecommerce'​:​ ​{
        ​'promoClick'​: ​​{​
            'promotions'​: ​​[{​ 
                'id'​: ​​ 'thermal-bottles-promo'​,
                'name'​:​ ​'Hot summer'​,​ 
                'creative'​:​ ​'hot_summer_0985.jpg'​,
                'position'​: ​​1
            }]​
        }​
    }​
});

Data layer: Add to cart

L’hit “Aggiungi al carrello” viene inviato ogni volta che un prodotto viene aggiunto al carrello. 

var​ dataLayer​ = ​window​.​dataLayer​ || ​​[];​
dataLayer​.​push​({​
    'event'​: ​​ 'eec.addToCart'​,
    'ecommerce'​: ​​{​
        'currencyCode'​: ​​ 'EUR'​,
        'add'​: ​​{​
            'products'​: ​​[{​
                'name'​: ​​ 'Insulated bottle - A589'​, ​
                'id'​: ​​ '2934865'​,
                'brand'​: ​​ 'Polar'​,
                'variant'​: ​​ 'A589'​,
                'category'​: ​​ 'Bottles'​​,
                'price'​: ​​ '14.99'​,
                'quantity'​: ​​1
            }]
        }​
    } 
});

Data layer: Remove from cart

L’hit “Rimuovi dal carrello” viene inviato ogni volta che un prodotto viene rimosso dal carrello. 

var​ dataLayer​ = ​window​.​dataLayer​ || ​​[];​
dataLayer​.​push​({​
    'event'​: ​​ 'eec.removeFromCart'​, 
    'ecommerce'​: ​​{​
        'remove'​: ​​{​
            'products'​: ​​[{​
                'name'​: ​​ 'Insulated bottle - A589'​, 
                'id'​: ​​ '2934865'​,
                'brand'​: ​​ 'Polar'​,
                'variant'​: ​​ 'A589'​,
                'category'​: ​​ 'Bottles'​,
                'price'​: ​​ '14.99'​,
                'quantity'​: ​​1​​ 
            }]​                 ​
        }​
    }
});

Data layer: Checkout step

L’hit che identifica uno step del checkout (dati anagrafici, dati di spedizione, dati di pagamento etc), viene inviato ogni volta che un utente raggiunge uno specifico step del checkout, corrispondente a quello dichiarato nella label.

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
    event: 'eec.checkoutStep',
    ecommerce: {
        checkout: {
            actionField: {
                step: 1
            },
            products: [{
                id: '2934865',
                name: 'Insulated bottle - A589',
                category: 'Bottles',
                variant: 'A589',
                brand: 'Polar',
                quantity: 1,
                price: '14.99'
            }, {
                id: '2934866',
                name: 'Insulated bottle - A588',
                category: 'Bottles',
                variant: 'A588',
                brand: 'Polar',
                quantity: 1,
                price: '14.99'
            }]
        }
    }
});

Data layer: Transaction

La transazione è lo step conclusivo e più importante, avviene quando l’ordine viene completato.

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
    event: 'eec.transaction',
    ecommerce: {
        currencyCode: 'EUR',
        purchase: {
            actionField: {
                id: '9398477',
                affiliation: 'Online Store',
                revenue: '25.99',
                tax: '3.99',
                shipping: '2.00',
                coupon: 'NEWSLETTER'
            },
            products: [{
                id: '2934865',
                name: 'Insulated bottle - A589',
                category: 'Bottles',
                variant: 'A589',
                brand: 'Polar',
                quantity: 1,
                price: '14.99'
            }, {
                name: 'Insulated bottle - A588',
                category: 'Bottles',
                variant: 'A588',
                brand: 'Polar',
                quantity: 1,
                price: '14.99'
            }]
        }
    }
});

Creazione degli attivatori e dei tag

Una volta che il Data Layer è stato popolato, è necessario inviare i dati a Google Analytics in una hit tramite un tag.

Per inviare le informazioni a Google Analytics puoi usare due differenti strategie:

  • inviare i dati tramite il tag di page view
  • inviare i dati tramite tag eventi personalizzati

Inviare i dati tramite il tag di page view

Questo metodo è semplice. Dalla variabile Google Analytics basta abilitare l’opzione Ecommerce avanzato e l’opzione Utilizza il livello dati. Tramite questa configurazione invierai le informazioni relative all’Ecommerce nell’hit di page view.

Chiaramente, dovrai assicurarti che tutte le informazioni da inviare ad Analytics siano disponibili prima del tag page view stesso. Se hai alcuni eventi che vengono generati e immessi nel Data Layer secondariamente alla visualizzazione di pagina, questi non saranno inviati ad Analytics.

Inviare i dati tramite il tag dedicati

Il secondo metodo invece prevede qualche difficoltà in più, ma la differenza principale è che, utilizzando gli eventi personalizzati, avrai a disposizione informazioni precise su quali eventi di Ecommerce avanzato sono stati raccolti in Google Analytics, rendendo più semplice il debug di un’implementazione non funzionante.

Nei prossimi capitoli vedremo dunque come implementare gli eventi personalizzati legati all’Ecommerce avanzato.

Creazione di un workspace dedicato

Prima di inserire qualsiasi un tag, creiamo un nuovo Workspace in Tag Manager dedicato all’implementazione di questi tag. Ci sarà utile per tenere momentaneamente separata la gestione dei tag relativa agli Ecommerce. Clicca su Default Workspace > +

Il tag e l’attivatore per le Product impression

Tramite le impression di prodotto puoi misurare il numero di volte che un prodotto compare negli elenchi del sito web, per esempio risultati della ricerca, prodotti visti di recente o prodotti correlati.

Tracciare correttamente le impression di prodotto ti darà accesso alla lettura del report Conversioni > Ecommerce > Rendimento elenco prodotti, dove potrai analizzare il rapporto fra impression e click e valutare il click through rate, aggiunte al carrello e acquisto di specifici prodotti.

Per quanto riguarda il tag esiste in questo caso una particolarità.
Se hai molti prodotti in un’unica pagina il quantitativo di dati da inviare potrebbe raggiungere il payload massimo per la singola hit, che è di 8k bytes, equivalente a una trentina di prodotti.
Se hai dunque liste contenenti più di 30 prodotti e invii i dati di impression nell’hit insieme alla pageview potresti sforare la dimensione del payload. Il risultato? L’informazione di page view, assieme a quella di impression, non viene inviata e viene dunque persa.

Ricorda

Se hai molti prodotti mostrati sulle pagine delle categorie di prodotti (più di 30), potresti perdere hit importanti, come il Page view, a causa della quantità di dati che è necessario inviare. Puoi diagnosticare questa problematica caricando la lista di prodotti più lunga del tuo sito verificando che in console non venga mostrato l’errore “Payload size is too large”. In questo caso puoi gestire la dimensione del payload tramite un custom task.
In alternativa dovrai spezzare l’invio dei dati di impression in più hit.

Devi dunque valutare con attenzione questa scelta (se hai dubbi scrivi un commento al post).
In ogni caso, se decidi di inviare questi dati insieme alla page view devi semplicemente abilitare l’opzione Attiva funzione Ecommerce avanzato > Utilizza il livello dati nel tag della page view in Tag manager.

Product impression

Se invece decidi di separare l’invio delle impression di prodotto dalla page view, ecco l’esempio di tag dedicato:

Il trigger sarà di tipologia evento personalizzato.

Una volta tracciate le impression, vediamo come misurare i click di prodotto.

Il tag per il Product click

I Product Click servono a misurare il numero di click che un prodotto genera negli elenchi del sito web, per esempio risultati della ricerca, prodotti visti di recente o prodotti correlati.

Product click

Esempio di tag dedicato:

Il trigger sarà di tipologia evento personalizzato.

Una volta tracciate le impression, vediamo come misurare i click di prodotto.

Il tag per le Promotion impression

Con il tracking delle promotion impression è possibile misurare il numero di volte che banner promozionali vengono visualizzati nel vostro sito web.

Tracciare correttamente le impression ti darà accesso alla lettura del report Conversioni > Ecommerce > Marketing > Promozione interna, dove potrai analizzare il rapporto fra impression e click e valutare il click through rate, transazioni ed entrate veicolate dalle promozioni attive.

Promotion impression

Esempio di tag dedicato:

Se volete essere indipendenti dagli sviluppatori, potete anche creare la vostra variabile Javascript personalizzata contenente i dati da impression, da utilizzare al posto della variabile di livello dati nel tag.

In GTM, da Variabili > Nuova > Javascript personalizzato inserite il codice contenente i dati dell’impression in questo formato.

Utilizzate questa variabile nel tag al posto del livello dati.

Per quanto riguarda il trigger, è necessario crearne uno di tipologia Evento personalizzato.

Oppure, se preferisci, puoi creare un trigger visibilità dell’elemento da Attivatori > Nuovo > Visibilità di un elemento e selezioniamo la classe css o l’id dell’elemento che identifica la promozione (solitamente un banner).

Il tag per Promotion Click

Con il tracking delle promotion click è possibile misurare il numero di click sui banner promozionali presenti nel vostro sito web.

Promotion click

Esempio di tag dedicato:

Il trigger sarà di tipologia evento personalizzato.

Il tag per l’add to cart

Con il tracking dell’aggiunta al carrello è possibile misurare quanti e quali prodotti vengono aggiunti al carrello.

Add to cart

Esempio di tag dedicato:

Dove le variabili di livello dati sono così configurate.

Nome del prodotto:

Quantità:

Per quanto riguarda il trigger, è necessario crearne uno di tipologia Evento personalizzato.

Il tag per il remove from cart

Con il tracking della rimozione dal carrello è possibile misurare quanti e quali prodotti vengono rimossi dal carrello.

Remove from cart

Esempio di tag dedicato:

Dove le variabili di livello dati sono così configurate.

Nome del prodotto:

Quantità:

Per quanto riguarda il trigger, è necessario crearne uno di tipologia Evento personalizzato.

Il tag per i checkout steps

Con il tracking degli step del checkout è possibile misurare quali step del checkout causano il maggior numero di abbandoni da parte degli utenti.

Per misurare gli step del checkout Google Analytics mette a disposizione l’oggetto checkout e la chiave actionField.

Se sei arrivato fino a questo step della guida dovresti aver già creato i checkout steps nel menù dedicato in Analytics. Nel mio caso il processo di checkout è formato da quattro step (carrello, indirizzo, informazione di spedizione, informazioni di pagamento). Ad ognuno ho assegnato una label. Tramite il data layer, il campo actionField viene valorizzato con il numero dello step corrispondente ad ogni pagina. Non rimane dunque che attivare un tag per ogni pagina che mandi questa informazione ad Analytics.

Checkout steps

Esempio di tag dedicato:

Dove le variabili di livello dati sono così configurate.

Checkout step:

Per quanto riguarda il trigger, è necessario crearne uno di tipologia Evento personalizzato.

Il tag per le transazioni

Il tracking delle transazioni è il tracking più importante dell’Enhanced Eecommerce. Tramite questo tracking è possibile avere in Google Analytics tutti i dati e statistiche relative alle entrate, alle vendite per prodotto e molto altro.

Transazione

Esempio di tag dedicato:

Dove le variabili di livello dati sono così configurate.

Transaction revenue:

Transaction ID:

Per quanto riguarda il trigger, è necessario crearne uno di tipologia Evento personalizzato.

E la configurazione è…completa! Analytics inizierà a raccogliere i dati sul tuo Ecommerce. Se hai dubbi sulla configurazione, lascia un commento, sarà mio piacere aiutarti.

Se non l’hai già fatto, inoltre, ti consiglio di consultare la Guida alla configurazione di Google Analytics.

Leave a Reply