Tagging lato server per Shopify

Stai cercando un modo semplice e veloce per impostare il tagging lato server di Shopify? Scegli l’applicazione Stape Conversion Tracking per Shopify. Con la nostra applicazione, potrai facilmente inserire uno script Google Tag Manager sul sito web, impostare un dominio personalizzato e un Custom Loader, inviare i dati degli utenti e degli eventi di e-commerce al livello dati e impostare webhook. Tutte queste funzioni ti consentiranno di rendere il monitoraggio più accurato, prolungando la durata dei cookie, rendendo il monitoraggio del browser resistente alle tecnologie di prevenzione del monitoraggio e inviando dati affidabili alle piattaforme pubblicitarie e di marketing attraverso l’endpoint del server. 

In questo post vedremo come configurare e installare l’applicazione Stape per Shopify, in modo da poter utilizzare queste potenti funzioni immediatamente.

Il tagging lato server può aumentare il successo delle tue campagne di marketing grazie a un preciso monitoraggio delle conversioni e all’analisi degli utenti. Tuttavia, per trarne il massimo vantaggio è necessaria una configurazione meticolosa, che non andrebbe mai trascurata.

Per semplificare al massimo l’implementazione del tagging lato server, abbiamo creato l’applicazione Server GTM Shopify. Questa applicazione è gratuita e aiuta a configurare facilmente il contenitore server di Google Tag Manager per il negozio Shopify. Ma prima, vediamo i principali vantaggi del tagging lato server per i siti Shopify. 

1. Migliore accuratezza dei dati. Il tagging lato server può contribuire a garantire una raccolta dati più accurata, riducendo il rischio di perdita di dati o di errori causati da blocchi pubblicitari, estensioni del browser o altri fattori lato client.

2. Attribuzione accurata delle conversioni. Grazie alla maggiore durata dei cookie e ai dati degli utenti inviati attraverso il server, le reti pubblicitarie possono attribuire con maggiore precisione le conversioni alle campagne di marketing. 

3. Miglioramento delle prestazioni del sito web. Grazie al tagging lato server, i tag vengono caricati sul server anziché sul client, riducendo la quantità di codice che deve essere caricata sul browser dell’utente. Questo può migliorare la velocità di caricamento del sito web, fattore cruciale per l’esperienza dell’utente e per la SEO.

4. Maggiore sicurezza. Il tagging lato server può contribuire a migliorare la sicurezza del sito web, riducendo il rischio di violazione dei dati o di altre minacce alla sicurezza causate da vulnerabilità lato client.

Espandete l'elemento sottostante per consultare la guida dettagliata.

L'app di Stape Conversion Tracking per Shopify può essere installata gratuitamente dal marketplace di Shopify

Nella scheda General trovate tutte le impostazioni relative all'aggiunta dello snippet GTM su tutte le pagine del vostro negozio Shopify, in modo da renderlo resistente agli ad blocker, all'ITP e alle limitazioni sulla durata dei cookie.

• Use Shopify Markets

Spuntate questa casella se gestite più mercati Shopify. Con questa funzione potete configurare l'iniezione GTM separatamente per ciascun mercato. Se la funzione è disabilitata, tutti i mercati utilizzano la configurazione predefinita.

Una volta attivata, vedrete i campi da configurare per ciascun mercato:

• Insert GTM: se spuntato, lo snippet GTM viene aggiunto a ogni pagina del sito.

• GTM container ID: l'ID del vostro container web GTM.

• Customer privacy API: se attivata, l'app rimanda il caricamento di GTM finché il visitatore non accetta i cookie tramite il banner Customer Privacy di Shopify. Questa opzione non è consigliata per impostazione predefinita.

• Custom domain, Stape container ID e Cookie Keeper: questi campi sono associati al tracking lato server; configurateli se utilizzate o intendete utilizzare la configurazione server-side. Di seguito spieghiamo dove trovare i valori per ciascun campo.

• GTM web container ID

Inserite qui l'ID del vostro container web GTM.

• Custom domain

È fondamentale usare il proprio sottodominio affinché i cookie first-party funzionino correttamente e il tracking sia affidabile in generale. Se non avete ancora aggiunto un sottodominio al vostro container sGTM, seguite la guida sui domini personalizzati.

• Custom Loader

Il suo utilizzo è fortemente raccomandato per aumentare la protezione dagli ad blocker.

Spuntate la casella corrispondente e specificate il vostro identificatore di container Stape. Per trovarlo, accedete al vostro account Stape, selezionate il container sGTM e individuate l'identificatore del container nella sezione Settings.

• Cookie Keeper 

Questa funzione consente di ridurre al minimo l'impatto delle più recenti restrizioni ITP. Prima di attivarla tramite l'app, assicuratevi di averla abilitata in Stape nel vostro container. Per configurare Cookie Keeper, fate clic sull'elemento espandibile e seguite le istruzioni:

• GTM snippet block

Qui potete copiare lo snippet GTM per installarlo su pagine che si trovano al di fuori del vostro tema Shopify (come le pagine create da app di terze parti quali Zipify).

Nella scheda Data Layer trovate gli eventi del data layer da attivare e configurare. Il secondo riquadro vi permette di controllare se i nomi degli eventi ricevono il suffisso _stape per evitare conflitti in GTM. Se è disattivato, gli eventi mantengono i loro nomi originali.

Qui trovate l'elenco completo degli eventi e dei loro payload, aggiunti tramite l'app Stape.

Attivazione del data layer:

• Attivate la casella Add ecommerce Data Layer events.
• Salvate le modifiche.
• Copiate il codice per il pixel personalizzato nel riquadro in fondo alla scheda Data Layer e seguite le istruzioni per aggiungerlo e attivarlo.

Nella sezione Customer privacy, sotto il menu a tendina dei permessi, assicuratevi di selezionare Not required. Il frammento di codice genera soltanto il Data Layer; non imposta cookie né trasmette dati a terze parti.

Nella scheda Data Layer è presente anche l'opzione Log events to console (Dev), uno strumento di debug per sviluppatori e amministratori del negozio. Quando abilitata, registra gli eventi e-commerce nella console del browser, mostra i payload degli eventi inviati al container server GTM/Stape per la verifica e aiuta nel debug dei Data Layer.

Questa opzione è pensata esclusivamente per lo sviluppo e deve essere disabilitata in produzione per evitare log non necessari nella console.

Gli eventi webhook vengono configurati nella scheda Webhook.

In questa scheda vengono configurati gli eventi webhook.

Per attivare un webhook, spuntate la casella, specificate l'URL del container server GTM e il /path a cui i webhook devono essere inviati.

Potete iscrivervi ai webhook quando viene creato un nuovo ordine o quando viene effettuato un rimborso su un ordine.

Alcuni articoli del blog utili sull'utilizzo e il debug dei webhook:

• Cosa sono i webhook e il loro uso nel monitoraggio lato server
• Debug dei webhook in entrata nell'anteprima del server di Google Tag Manager
• Tracciamento server-to-server nel server Google Tag Manager

Consente di compilare e aggiornare automaticamente le liste Customer Match in Google Ads.

Saltate la configurazione di questa scheda se non gestite campagne Google Ads o non utilizzate liste Customer Match.

Il container server non ha accesso diretto ai dati del browser, come il data layer, i cookie o il contesto della pagina. Pertanto, questi dati devono essere inviati esplicitamente dal container web.

• Data Tag, abbinato a Data Client nel contenitore server per ricevere e analizzare le sue richieste, invia le variabili del data layer e altri parametri indipendentemente da qualsiasi piattaforma specifica;
• Google Analytics 4, che invia i dati tramite un Google Tag configurato con l’URL del contenitore server. Entrambi i metodi sono descritti di seguito.

Passo 1. Installa il modello del Data Tag:

1. 1.
   Fai clic sul menu “Tag”.
2. 2.
   Fare clic su “Nuovo”.
3. 3.
   Aprire la sezione ‘Modelli’ del proprio contenitore Web di Google Tag Manager → aggiungere il Data Tag dalla galleria dei modelli.
4. 4.
   Fare clic sulla scheda “Configurazione tag”.
5. 5.
   Fare clic su “Scopri altri tipi di tag nella Galleria dei modelli della community” → cercare “Data Tag” → fare clic su “Aggiungi all'area di lavoro” → fare clic su “Aggiungi”.

Passo 2. Successivamente, configureremo il Data Tag per l’evento “pageview”:

1. 1.
   Sotto Nome evento, puoi selezionare un nome di evento standard, aggiungere un nome di evento personalizzato o aggiungere un nome di evento dinamico utilizzando la variabile {{Event}}.
2. 2.
   Inserisci il tuo URL lato server di GTM (puoi trovare il tuo URL lato server di GTM all’interno dell’account stape.io aprendo il contenitore sGTM e controllando la sezione Dominio.)
3. 3.
   Seleziona come desideri che i dati vengano inviati:

   1. 3.1.
      Invia tutto dal DataLayer: invierà tutte le informazioni presenti nel DataLayer web di GTM ai dati degli eventi GTM sul server.
   2. 3.2.
      Invia dati comuni: aggiunge alla richiesta page_location, page_path, page_hostname, page_referrer, page_title, page_encoding, screen_resolution, viewport_size.
   3. 3.3.
      Aggiungi stato di consenso: aggiunge l’oggetto consent_state alla richiesta, includendo le seguenti proprietà: ad_storage, analytics_storage, functionality_storage, personalization_storage, security_storage.
   4. 3.4.
      Aggiungi cookie comuni: il tag invierà cookie comuni in `eventData` per aggirare alcune limitazioni delle piattaforme di e-commerce. Ad esempio, ciò è necessario per gli eventi che funzionano sulle pagine di checkout di Shopify.
4. 4.
   Nella sezione Dati evento, puoi aggiungere qualsiasi dato manuale alla richiesta. Puoi anche applicare trasformazioni (come l’hashing, il trimming, ecc.) o memorizzare i dati.
5. 5.
   Nella sezione Dati utente, puoi inviare parametri utente e applicare trasformazioni o memorizzare i dati.
6. 6.
   In Impostazioni e Impostazioni avanzate troverai esattamente ciò che suggerisce il nome: opzioni di configurazione avanzate. A meno che tu non sappia esattamente cosa stai facendo, è meglio non modificare queste impostazioni.
7. 7.
   Assegna al tuo tag un nome descrittivo e fai clic su Salva.

Passaggio 3. Successivamente, puoi configurare il Data Tag per altri eventi. L’esempio seguente mostra come configurare gli eventi di e-commerce quando il Data Layer è disponibile.

Questo tag attiva ogni evento di e-commerce presente nel Data Layer. In questo esempio, tutti gli eventi di e-commerce terminano con _stape, quindi utilizziamo un’espressione regolare che cattura tutti gli eventi contenenti _stape.

Esempio della variabile che estrae i dati utente dal Data Layer.

Passaggio 4. Successivamente, scarica il Data Client da GitHub:

1. 1.
   Segui questo link.
2. 2.
   Fare clic su Codice → Scarica ZIP.

Passaggio 5. Ora importare il client dati:

1. 1.
   Aprire il contenitore Server di Google Tag Manager.
2. 2.
   Fare clic su Modelli.
3. 3.
   In Client, fare clic su Nuovo.
4. 4.
   Fare clic sui tre puntini nell’angolo in alto a destra.
5. 5.
   Fai clic su B ImportaB e seleziona il Data Client che hai scaricato da GitHub (potrebbe essere necessario decomprimere prima l’archivio).
6. 6.
   Una volta completata l’importazione, fai clic su Salva.

Passaggio 6. Apri la scheda Clienti e fai clic su Nuovo → seleziona Data Client → fai clic su Salva.

Passo 7. Apri le schermate di anteprima di GTM per “Web” e “Server” e verifica la configurazione. Dovresti vedere che il Data Tag viene attivato nel contenitore GTM “Web” e che il Data Client sta elaborando le richieste del Data Tag in sGTM.

Passo 1. Crea una variabile di configurazione per l'URL del container del server. Per farlo:

1. 1.
   Fai clic sul menu Variabili.
2. 2.
   Fai clic su Nuovo sotto la barra Variabile definita dall'utente.
3. 3.
   Fare clic sulla barra Configurazione variabile.
4. 4.
   Selezionare il tipo Tag Google: Impostazioni di configurazione.
5. 5.
   Fare clic su Aggiungi parametro.
6. 6.
   Inserire i seguenti parametri:

   1. 6.1.
      Parametro di configurazione: server_container_url.
   2. 6.2.
      Valore: l’URL del proprio contenitore server di Tag Manager.
7. 7.
   Assegnare alla variabile un nome descrittivo e fare clic su Salva.

Passaggio 2. Creare un tag di Google Analytics 4:

1. 1.
   Fare clic sul menu Tag.
2. 2.
   Fai clic su Nuovo.
3. 3.
   Fai clic sulla scheda Configurazione tag.
4. 4.
   Seleziona Google Analytics → Google Tag.
5. 5.
   In ID tag, inserisci l’ID del tuo account GA4 (per trovarlo, vai su GA4 → fai clic su Amministrazione → Flussi di dati → seleziona il flusso → consulta ID di misurazione).
6. 6.
   In Impostazioni di configurazione, seleziona la variabile del contenitore del server che hai creato in precedenza.
7. 7.
   In Attivazione, assicurati che l’opzione Inizializzazione - Attivazione su tutte le pagine sia selezionata.
8. 8.
   Assegna al tuo tag un nome descrittivo e clicca su Salva.
9. 9.
   Clicca su Pubblica per rendere attivo il contenitore.

Passo 3. Ora vediamo come creare un evento GA4, utilizzando l’evento B Tutti i clicB come esempio:

1. 1.
   Clicca sul menu Tag.
2. 2.
   Fai clic su Nuovo.
3. 3.
   Fai clic sulla scheda Configurazione tag.
4. 4.
   Seleziona Google Analytics → Google Analytics: Evento GA4.
5. 5.
   Inserisci il tuo ID Misurazione (dal menu Flussi di dati di GA4).
6. 6.
   Assegna al tuo evento un nome descrittivo.
7. 7.
   Fai clic su Attivazione → Tutti i clic.
8. 8.
   Assegna al tag un nome descrittivo.
9. 9.
   Fai clic su Salva.

Successivamente, dovrai configurare l’invio dei dati degli eventi alla tua piattaforma di marketing/analisi. I passaggi esatti dipenderanno dalla piattaforma scelta. Consulta le nostre guide sulle piattaforme più diffuse per ulteriori informazioni:

• Come configurare l’API Meta Conversions
• Come configurare il monitoraggio di Google Analytics 4 (GA4)
• Come configurare il monitoraggio delle conversioni di Google Ads
• Altre piattaforme

La maggior parte dei principali strumenti di marketing e analisi supporta già il tagging lato server e dispone di tag per sGTM. Sul nostro sito trovate guide per implementarli, ad esempio per Facebook CAPI, TikTok Events API, Snapchat Conversions API, tracking lato server di Google Ads e così via.

Debug del download GTM

Dopo l'attivazione o qualsiasi modifica, è consigliabile verificare che il container sia effettivamente caricato sul sito.

Per farlo, andate su una qualsiasi pagina del vostro sito, aprite la console del browser e, nella scheda di rete, filtrate per il vostro sottodominio o URL del server di tagging. Dovreste vedere una richiesta come nello screenshot seguente con lo stato di risposta 200.

Debug degli eventi data layer nel checkout

Per gli eventi che avvengono prima della pagina di checkout, tutto funziona come su qualsiasi altra piattaforma: potete avviare l'anteprima del vostro container web GTM e visualizzare tutti gli eventi.

Gli eventi di checkout non vengono visualizzati in GTM Preview a causa dell'ambiente isolato di queste pagine, che blocca la manipolazione del DOM e l'iniezione di script senza restrizioni, incluso lo snippet GTM.

Potete però inserire manualmente lo snippet sulla pagina di checkout utilizzando l'estensione Chrome Stape GTM Helper:

• Dopo aver avviato il Preview Mode in GTM, attivate il pulsante Shopify Sandbox dataLayer nella scheda Settings dell'estensione.
• Nella scheda Inject GTM, fate clic su Enable injection, aggiungete il nome del vostro dominio e il GTM ID. Salvate le modifiche.

Gli eventi sulla pagina di checkout verranno ora visualizzati in GTM Preview.

Le possibilità del tagging lato server si stanno espandendo velocemente, offrendo un ottimo strumento per migliorare l’accuratezza del monitoraggio delle conversioni e delle analisi. Inoltre, Stape sta cercando di semplificare l’uso di sGTM per i propri clienti, per cui ha rilasciato l’applicazione Conversion Tracking per Shopify. 

Stape Conversion Tracking per Shopify è uno strumento fantastico con numerose funzionalità e vantaggi. Ad esempio, puoi impostare facilmente il monitoraggio sul tuo sito web aggiungendo uno script di Google Tag Manager e configurando dominio e Custom Loader. Inoltre, puoi inviare i dati dell’utente al livello dati e impostare webhook. 

Tutte queste caratteristiche contribuiscono a rendere più precisi i dati delle analisi, prolungando la durata dei cookie e rendendo il monitoraggio del browser resistente alle tecnologie di prevenzione del monitoraggio. Questi strumenti sono indispensabili per una trasmissione affidabile dei dati attraverso l’endpoint del server alle piattaforme pubblicitarie e di marketing. 

Se cerchi una soluzione semplice e veloce per impostare il tagging lato server di Shopify, Stape è la soluzione giusta. Approfitta oggi stesso di questa straordinaria soluzione e sfrutta i vantaggi di un monitoraggio più accurato con l’app Stape Conversion Tracking per Shopify. Provala subito: siamo sicuri che non ti deluderà!