Cos’è e come configurare Elevar su Shopify implementando il tracciamento dati Server-Side per GA4

Cos’è e quali sono i vantaggi di Elevar in Shopify

Elevar è una piattaforma che si inserisce tra lo store Shopify e le destinazioni di marketing, tra cui GA4, Google Ads, Meta e decine di altre integrazioni. Il modello concettuale su cui si basa è quello di Source e Destination.

Una Source è la sorgente di dati che alimenta Elevar (nel caso di Shopify, il dataLayer generato dal tema più i webhook degli ordini, le notifiche automatiche che Shopify invia in tempo reale quando un ordine viene creato o aggiornato); una Destination è dove quei dati vengono inviati.

Quando si tratta di tracciare i dati di un ecommerce in Shopify, l’app Elevar nasce per risolvere due problemi per tracciare dati numerosi e di qualità:

1. fornisce un dataLayer standardizzato e pronto all’uso (perfetto per iniziare a tracciare dati ecommerce) per Shopify, riducendo tempi ed errori durante la configurazione
2. offre un’infrastruttura di tracciamento server-side, un sistema che sposta l’invio dei dati dal browser dell’utente a un server intermedio, riducendo l’esposizione ad ad blocker e ai browser degli utenti che limitano la quantità e qualità dei dati raccolti.

Questa guida spiega come installare Elevar, come collegarlo a Google Tag Manager e come configurare correttamente gli eventi di tracciamento ecommerce verso GA4.

Prerequisiti implementazione eventi tracciamento ecommerce Shopify

Prima di iniziare, servono:

• accesso Admin allo store Shopify, per installare l’app e attivare il Theme App Embed
• una property GA4 già creata, con il relativo Measurement ID (G-XXXXXXX)
• accesso come Amministratore Account al container Google Tag Manager
• se vuoi creare eventi personalizzati ti occorre un piano Elevar a pagamento (il piano Tagger parte da circa 19$/mese). L’installazione e gli eventi ecommerce standard, invece, non necessitano di piano a pagamento.

Installazione dell’app Elevar su Shopify

L’app si installa dallo Shopify App Store cercando “Elevar Conversion Tracking” (raggiungibile anche direttamente su apps.shopify.com/gtm-datalayer-by-elevar).

Dopo aver rivisto i permessi richiesti, si clicca su “Install”.

A installazione completata si viene reindirizzati alla piattaforma Elevar, dove si sceglie tra “Existing Website”, se si vuole collegare questo store a un’azienda già registrata su Elevar, e “New Website”, per un nuovo progetto.

Un passaggio distinto, e altrettanto obbligatorio, è l’attivazione del Theme App Embed: una funzione di Shopify che permette alle app di collegare al tema del sito i piccoli blocchi di codice necessari al loro funzionamento, attivabili o disattivabili con un semplice interruttore dall’editor del tema.

Senza attivarlo, l’app resta installata, ma di fatto spenta sul sito.

Per farlo, da Shopify Admin

• vai su Sales channels, poi clicca su Online Store e poi su Themes, Customize
• nel menu a sinistra dell’editor tema, seleziona App Embeds
• cerca “Elevar Data Layer” e attiva il relativo interruttore

• clicca su “Salva”.

Senza questo passaggio, il dataLayer non viene iniettato nel tema e nessun evento viene tracciato, anche se l’app
risulta installata correttamente.

Configurazione della Shopify Source

Dalla dashboard Elevar, sezione “My Tracking”, si trova il box Shopify con il pulsante “Set Up Now”.

Si apre un wizard (una procedura guidata) in più passaggi.

1. Store Settings (o General Settings) è la prima schermata dei dati generali dell’ecommerce. In questo step devi:

• verificare che la connessione allo store sia attiva
• indicare se vendi anche di persona “offline” (Do you sell in person?)
• (se vuoi gestire il tracciamento con Google Tag Manager) attivare l’opzione “Allow Google Tag Manager for client-side tracking” che trovi nel menu Advanced Options (sarà Elevar a caricare il tuo container)

2. Subscriptions va attivata solo se nel catalogo sono presenti prodotti in abbonamento.

3. Consent Mode: qui decidi se collegare il tracciamento server-side alle scelte di consenso espresse dagli utenti sul banner dei cookie. Se lo attivi, scegli le categorie di consenso da usare come impostazione di riserva finché il sistema non ha ancora ricevuto la risposta del visitatore.

4. Una volta completati questi tre passaggi, la pagina mostra lo stato del Theme App Embed:

• Se non risulta ancora attivo, compare il riquadro Enable App Embed con il pulsante Go to Shopify, che ti porta alla scheda App embeds del tema. Attiva il toggle e salva.

SCREEN

• Tornando su questa pagina, il riquadro si aggiorna da solo con la conferma verde “Detected on Live Theme” e il messaggio “We detected our App Embed on your live theme”. È il segnale che la Shopify Source è installata e attiva correttamente.

Collegare Elevar a Google Tag Manager

Per permettere a Elevar di leggere e scrivere sul container, serve concedere l’accesso Amministratore Account. Da tagmanager.google.com si va su Admin, poi Container, poi User Management; si clicca sul pulsante “+” in alto a destra e si seleziona “Add Users”.

Si inserisce l’indirizzo google@getelevar.com e, nella sezione dei permessi container, si selezionano tutte le voci disponibili.

Importare i tag pronti (Pre-Built Tag Containers)

Configurare da zero in GTM tutti i tag, i trigger e le variabili necessari per intercettare gli eventi del dataLayer Elevar sarebbe un lavoro lungo e soggetto a errori.

Elevar mette a disposizione i Pre-Built Tag Containers: pacchetti già pronti, scaricabili come un semplice file, che contengono tutta la configurazione già impostata, cioè tag, condizioni di attivazione e variabili, e che si possono importare in GTM con pochi click, senza doverli costruire manualmente uno a uno.

Tuttavia, per configurare i tag di tracciamento Shopify hai due strade:

Percorso A — Catalogo “Pre-Built Tags” (Download Container). Sono container generici con valori segnaposto da compilare a mano: per questo includono la cartella “UPDATE AFTER IMPORTING” (step 7–8 qui sotto).

Percorso B — “Download Pre-Built Web Tags” (dallo step Web Container Setup della destinazione GA4). Elevar genera un container già personalizzato con la property GA4 collegata: non restano segnaposto, quindi NON compare la cartella “UPDATE AFTER IMPORTING” e non devi aggiornare nulla a mano.

Per completare la configurazione dei tag segui questi step:

1. Nella tab Pre-Built Tags di Elevar cerca “GA4” e apri il tag e clicca su “Download Container” per scaricare il file
2. Importare il container scaricato in GTM: vai su Admin › Import Container › Choose container file, seleziona il file
3. Scegli il Workspace (l’“area di lavoro” di GTM)
4. Come “Import Option” scegli “Merge” → “Overwrite conflicting tags, triggers, and variables”
5. Clicca “Confirm”.

Step aggiuntivi da eseguire se hai scelto il Percoso A (catalogo Pre-Built Tags):

• Aggiorna le variabili segnaposto: in GTM apri Folders › cartella “UPDATE AFTER IMPORTING”. [SCREEN 7]
• Inserisci i valori reali (es. Measurement ID), rimuovi dal nome “Update After Elevar Import” e salva.

Eventi personalizzati con il GTM Event Builder

Per tracciare interazioni non coperte dagli eventi standard, ad esempio il click su un elemento specifico dell’interfaccia, Elevar mette a disposizione il GTM Event Builder, un’estensione Chrome che permette di creare tag e trigger puntando e cliccando direttamente sugli elementi della pagina, senza scrivere codice.

Facciamo un esempio concreto: vuoi sapere quante persone cliccano su un pulsante “Scarica la guida” presente in una pagina (un’azione che non rientra tra gli eventi tracciati automaticamente).

1. Dopo aver installato l’estensione Chrome e collegato, dalle impostazioni dell’account Elevar, sia l’account Google sia il Workspace GTM di destinazione, apri l’estensione direttamente sulla pagina del sito e crea un nuovo Trigger, cioè la condizione che fa scattare la registrazione dell’evento.

2. Scegli il Trigger di tipo Click, pensato proprio per registrare un clic su un pulsante o un link. Tra gli altri Trigger più comuni e usati ci sono anche:

• Visibility, che si attiva quando un elemento diventa visibile durante lo scorrimento della pagina, utile ad esempio per popup o recensioni,
• Pageview, che si attiva al caricamento di una pagina,
• Form, che si attiva quando un modulo viene inviato).

3. Dopo aver scelto il Trigger di tipo Click, clicca sul pulsante “Scarica la guida” per indicare all’estensione quale elemento monitorare, e salva il Trigger.

A questo punto si aggiunge un nuovo Tag di tipo “Google Analytics GA4 Event”, gli si assegna un nome che identifichi l’evento, ad esempio “download_guida”, e si compilano gli eventuali parametri aggiuntivi, poi salva anche il Tag.

Il nuovo evento viene importato in GTM, ma resta in bozza: prima di essere davvero attivo sul sito va controllato in anteprima e pubblicato manualmente da GTM, come qualsiasi altra modifica al container, per evitare di mandare in produzione un tag non verificato.

Gli eventi ecommerce tracciati e la corrispondenza con GA4

Una volta installata la Shopify Source, Elevar registra automaticamente, senza bisogno di configurazioni aggiuntive, una serie di eventi standard che ricalcano il percorso d’acquisto di un cliente, dalla visita a una scheda prodotto fino al completamento dell’ordine.

Nel dataLayer, questi eventi hanno tutti un nome che comincia con il prefisso dl_, abbreviazione di data layer:

• dl_user_data si attiva su ogni pagina, equivale a una pageview.
• dl_view_item_list i prodotti di una collection diventano visibili nel viewport.
• dl_view_item vista della scheda prodotto.
• dl_select_item click su un prodotto all’interno di una lista o collection.
• dl_add_to_cart / dl_remove_from_cart aggiunta o rimozione di un prodotto dal carrello.
• dl_view_cart vista del carrello.
• dl_begin_checkout / dl_add_shipping_info / dl_add_payment_info passaggi del funnel di checkout (alcuni non disponibili con gli express checkout).
• dl_purchase ordine completato.
• dl_sign_up / dl_login / dl_subscribe creazione account, login, iscrizione a email o SMS.

Nella dashboard Elevar questi eventi vengono presentati con un’etichetta più leggibile (Page View, Product List View, Product Clicked, e così via).

Alcuni eventi più specifici, legati a funzionalità che non tutti gli store hanno, non vengono generati in automatico da Elevar. È il caso di:

• Add to Wishlist (aggiunta a una lista dei desideri)
• Customize Item (personalizzazione di un prodotto)
• Complete Quiz (completamento di un questionario di orientamento all’acquisto)
• Start Trial (avvio di una prova gratuita)
• Find Location (ricerca di un punto vendita)
• Schedule (prenotazione di un appuntamento o di un servizio).

Se il tuo ecommerce offre una di queste funzionalità e vuoi che venga tracciata, l’evento va aggiunto manualmente al dataLayer, un intervento tecnico che richiede competenze di sviluppo e che va progettato caso per caso in base a come funziona quella specifica funzionalità sul sito.

Configurare GA4 come destinazione server-side

Questo è il passaggio che permette a Elevar di inviare direttamente a GA4 gli eventi legati agli acquisti, senza passare dal browser del cliente.

In questo modo si recuperano anche le conversioni che altrimenti andrebbero perse a causa di ad blocker o dei limiti che i browser impongono alla raccolta dati.

La buona notizia è che tutta la configurazione avviene dentro la dashboard di Elevar tramite un percorso guidato a click, senza dover scrivere o incollare alcun codice.

1. Aggiungi la destinazione: da “My Tracking” si clicca su “Add Destination” > cerca “GA4” > clicca su “Get Started” per avviare la configurazione.

2. Scegli quali eventi inviare. Questa scelta riguarda solo quali eventi vanno SERVER-SIDE: gli altri restano tracciati client-side, non li stai spegnendo.

• Use best practices (consigliata): invia server-side il solo purchase, l’evento più importante e più penalizzato da ad blocker sulla Thank You page. Il resto del funnel resta tracciato client-side. In questo modo eviti il doppio conteggio di eventi tracciati.
• Customize settings: aggiungi altri eventi server-side. Attenzione: gli eventi di checkout server-side sono sconsigliati da Elevar (con GA4 manca il timestamp → ordine non garantito); Refund richiede Order ID e non funziona con Consent Mode; gli eventi sitewide non sono ancora supportati. Usala solo con esigenze specifiche.

4. Configura il Consent Mode: si decide se collegare anche questa destinazione specifica alle scelte di consenso espresse dai visitatori.

5. Filtro degli ordini: decidi se escludere alcune tipologie di ordine dall’invio a GA4, ad esempio quelli generati da resi o cambi merce (Filter Transactions).

6. Scegli la modalità di tracciamento lato browser (Client-Side Tracking Setup). Questa opzione determina come vengono inviati gli eventi di tracciamento che avvengono nel browser (tutti tranne l’acquisto che viene gestito lato server).

In entrambi i casi i dati vengono tracciati: cambia il motore e la manutenzione.

• Using Elevar (senza GTM): opzione migliore nella maggior parte dei casi, poiché Elevar invia gli eventi dal proprio data layer. Si imposta pochi in minuti, meno errori e dati duplicati, aggiornamenti automatici, nessun container da mantenere. L’unico limite sono le personalizzazioni di eventi e parametri che puoi inviare.
• Using Google Tag Manager: gli eventi passano dal tuo container GTM. In questo caso hai la flessibilità (trigger su misura, parametri/custom dimension extra), ma richiede più manutenzione per controlli e aggiornamenti. È attivo solo dopo aver importato e pubblicato il relativo container GTM, con “Allow GTM for client-side tracking” attivo nella Source.

7. Attiva la destinazione: nella schermata finale controlla il riepilogo dell’implementazione (Configuration Summary) e, se tutto risulta corretto, clicca su “Go Live” confermando con “Yes, Go Live”.

Da questo momento la destinazione è attiva e comincia a inviare dati a GA4.

Testare e validare il tracciamento

Prima di considerare il setup concluso, va sempre verificato che ogni evento si attivi correttamente e con i parametri giusti.

Per la parte storefront, collection, scheda prodotto, carrello, lo strumento principale resta il Preview Mode di GTM.

Per effettuare i test, clicca su Preview, inserisci l’URL dell’ecommerce e naviga il sito pagina per pagina, controllando nel pannello Data Layer

• che l’evento atteso si attivi (dl_view_item_list sulla collection, dl_view_item sulla scheda prodotto, dl_add_to_cart sull’aggiunta al carrello)
• che le variabili chiave, come nome prodotto, ID e prezzo, non risultino vuote.

Per checkout e Thank You page il discorso cambia. Questi eventi passano dalla Customer Events API di Shopify, che carica il codice in un contesto separato dal resto della pagina: il Preview Mode di GTM non riesce a intercettarli.

In questo caso gli strumenti utili sono

• il pannello Network dei dev tools del browser, che mostra la richiesta esatta inviata a ogni destinazione con i relativi parametri nella query string
• gli strumenti di debug specifici, ad esempio il Pixel Helper per le campagne adv su Meta.

Per gli eventi inviati server-side, la verifica va fatta direttamente sulla destinazione: in GA4, il report Real Time dovrebbe mostrare un evento riconducibile all’integrazione Elevar, filtrabile per tipologia di azione.

Chi ha un piano Elevar Advanced o superiore ha inoltre accesso al Channel Accuracy Report, un confronto tra gli ordini ricevuti da GA4 e gli ordini reali registrati su Shopify, disponibile con un dettaglio orario a partire da circa due ore dopo il go live.

P.S.: Vuoi ricevere guide pratiche, risorse di approfondimento e webinar formativi gratuiti su tracciamento e analisi dati direttamente nella tua inbox, già scelta da oltre 7.800 professionisti del web?

Iscriviti qui alla newsletter gratuita di Tag Manager Italia