E-commerce GA4 (analytics.js - E-commerce standard): inviare gli eventi di e-commerce GA4

Questa guida descrive come eseguire la migrazione di un'implementazione di e-commerce standard esistente per analytics.js Universal Analytics al fine di utilizzare gli eventi di e-commerce Google Analytics 4.

Visita il Centro di migrazione per gli sviluppatori per ulteriori risorse e guide alla migrazione.

Risultato

Il risultato di questa guida è che la nuova implementazione di Google Analytics 4 invia gli eventi e-commerce GA4 a una nuova proprietà GA4 e a una proprietà Universal Analytics esistente. La proprietà Universal Analytics esistente riceverà i dati e-commerce di GA4, ma i report rimarranno invariati.

La migrazione prevede due fasi:

Prima di iniziare

  1. Verifica che quanto segue descriva la tua implementazione corrente:

    • Utilizzi una proprietà Universal Analytics.
      • Se la tua proprietà ha un ID monitoraggio, si tratta di Universal Analytics.
    • Il tuo sito utilizza la libreria analytics.js per inviare eventi di e-commerce.

  2. Consulta le opzioni di migrazione per le implementazioni dell'e-commerce per conoscere i compromessi di ciascuna opzione. Conferma di voler effettivamente seguire questa guida per utilizzare gli eventi e-commerce di Google Analytics 4 per l'implementazione esistente di Universal Analytics.

  3. Consulta il riferimento sulla compatibilità degli eventi per scoprire come l'evento di acquisto GA4 viene tradotto quando viene inviato a una proprietà UA.

Vantaggi e considerazioni

Esamina e considera le informazioni di seguito per comprendere appieno le implicazioni dell'utilizzo degli eventi di e-commerce di Google Analytics 4 con l'implementazione dell'e-commerce di Universal Analytics.

Vantaggi Svantaggi
  • Visualizza i dati di e-commerce sia nei report di GA4 sia in quelli di Universal Analytics.
  • La migrazione all'evento purchase di GA4 fornirà report e-commerce UA completi.
  • Lavoro aggiuntivo per la migrazione da analytics.js a gtag.js. Ti consigliamo di eseguire la migrazione di tutte le misurazioni personalizzate da analytics.js a gtag.js (ad es. eventi, visualizzazioni di pagina, tempistiche e così via).

Implementazione

1. Eseguire la migrazione della misurazione di UA da analytics.js a gtag.js

Per inviare gli eventi di e-commerce GA4, è necessario eseguire la migrazione da analytics.js a gtag.js, incluse eventuali misurazioni personalizzate.

In genere, i passaggi per completare la migrazione includono quanto segue:

  1. Rimuovi lo snippet analytics.js.
  2. Installa il tag Google (gtag.js) e configuralo con l'ID monitoraggio della tua proprietà UA.
  3. Esegui la migrazione del codice di misurazione personalizzato da analytics.js a gtag.js. Le sezioni seguenti descrivono come eseguire la migrazione di una transazione e-commerce standard. Per assistenza generale sulla migrazione di altri scenari di misurazione, consulta Migrazione della misurazione.

Prima: tag analytics.js

<!-- Google Analytics -->
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXX-Y', 'auto');    // Universal Analytics property.
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

Dopo: tag Google (gtag.js)

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXX-Y');    // Universal Analytics property.
</script>

2. Aggiornare l'implementazione dell'e-commerce per inviare gli eventi GA4

Aggiorna l'implementazione dell'e-commerce esistente per eseguire la migrazione dagli eventi di e-commerce di Universal Analytics agli eventi di Google Analytics 4. Una volta completato questo passaggio, la tua proprietà Universal Analytics riceverà un evento purchase di GA4. Esamina i vantaggi e le considerazioni per comprendere le implicazioni di questo aggiornamento.

L'esempio di seguito illustra come eseguire la migrazione di un evento di transazione e-commerce standard analytics.js a un evento purchase di e-commerce GA4 equivalente, compatibile con Universal Analytics.

Prima: transazione e-commerce standard UA (analytics.js)

L'esempio seguente mostra l'implementazione dell'e-commerce standard di analytics.js per una transazione con due elementi:

// Add the transaction.
ga('ecommerce:addTransaction', {
  id: '1234',     // Transaction ID.
  affiliation: 'Google Store',
  revenue: '29.97',
  shipping: '5.25',
  tax: '2.42'
});

// Add the items belonging to the transaction.
ga('ecommerce:addItem', {
  id: '1234',     // Transaction ID.
  name: 'Android Warhol T-Shirt',
  sku: 'P12345',  // Item ID.
  category: 'Apparel/T-Shirts',
  price: '12.99',
  quantity: '2'
});
ga('ecommerce:addItem', {
  id: '1234',     // Transaction ID.
  name: 'Flame challenge T-Shirt',
  sku: 'P67890',  // Item ID.
  category: 'Apparel/T-Shirts',
  price: '3.99',
  quantity: '1'
});
ga('ecommerce:send');

Dopo: acquisto e-commerce GA4 (gtag.js)

Quando esegui la migrazione di un evento di transazione analytics.js a un evento purchase di GA4, le principali differenze sono:

  • GA4 ha un singolo evento purchase che include tutti i dettagli e gli elementi correlati alla transazione. analytics.js esegue più comandi di e-commerce ga() per acquisire le stesse informazioni.
  • GA4 ha un singolo campo transaction_id per l'intero evento. analytics.js richiede che l'ID transazione sia incluso in ogni elemento.
  • GA4 ha più campi di categoria di elementi. analytics.js utilizza un singolo campo di categoria con un delimitatore / per descrivere le gerarchie. Tuttavia, gli eventi GA4 con più campi di categoria di elementi funzioneranno per la tua proprietà UA a causa della traduzione dei parametri di categoria.
 gtag('event', 'purchase', {
   currency: 'USD',
   transaction_id: '1234',    // Transaction ID.
   value: 29.97,
   affiliation: 'Google Store',
   shipping: 5.25,
   tax: 2.42,
   items: [
    {
      item_id: 'P12345',     // Item ID.
      item_name: 'Android Warhol T-Shirt',
      item_category: 'Apparel',
      item_category2: 'T-Shirts',
      price: 12.99,
      quantity: 2
    },
    {
      item_id: 'P67890',    // Item ID.
      item_name: 'Flame challenge T-Shirt',
      item_category: 'Apparel',
      item_category2: 'T-Shirts',
      price: 3.99,
      quantity: 1
    }
  ]
});

3. Creare e configurare una nuova proprietà GA4

Dopo aver aggiornato l'implementazione dell'e-commerce per inviare gli eventi e-commerce GA4, completa una delle seguenti opzioni per iniziare a inviare dati a una nuova proprietà Google Analytics 4.

Opzione 1: utilizzare l'Assistente alla configurazione GA4 e attivare i tag del sito collegati

L'Assistente alla configurazione GA4 creerà automaticamente una nuova proprietà GA4 e copierà le seguenti impostazioni dalla proprietà Universal Analytics: nome proprietà, URL del sito web, fuso orario e impostazioni valuta. Può anche attivare la funzionalità tag del sito collegato per riutilizzare l'implementazione esistente di gtag.js di Universal Analytics al fine di caricare la nuova proprietà GA4.

Segui i passaggi descritti nell'Assistente alla configurazione GA4 per creare e configurare una nuova proprietà Google Analytics 4. Assicurati di selezionare l'opzione Attiva la raccolta dati utilizzando i tag esistenti per utilizzare la funzionalità dei tag del sito collegati.

Opzione 2: aggiorna lo snippet gtag.js

  1. Crea una nuova proprietà Google Analytics 4.
    • Utilizza l'Assistente alla configurazione GA4 per aggiungere una proprietà Google Analytics 4. Tuttavia, deseleziona l'opzione Attiva la raccolta dati utilizzando i tag esistenti quando richiesto durante la configurazione. In alternativa, crea una proprietà Google Analytics 4 senza l'Assistente alla configurazione GA4. Il vantaggio di usare l'assistente è che copierà alcune impostazioni di base della tua proprietà Universal Analytics.
  2. Trova l'ID tag della proprietà Google Analytics 4.
  3. Aggiungi la proprietà Google Analytics 4 allo snippet gtag.js esistente utilizzando il comando config con l'ID tag.

Di seguito è riportato un esempio di snippet gtag.js in cui è configurata una proprietà Universal Analytics e Google Analytics 4.

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXX-Y"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-XXXXX-Y');         // Universal Analytics property.
  gtag('config', 'TAG_ID');  // Google Analytics 4 property.
</script>

4. (Facoltativo) Misurare gli eventi di e-commerce aggiuntivi

Per sfruttare al massimo i report sull'e-commerce GA4, implementa altri eventi di e-commerce GA4. Per scoprire di più, consulta la sezione E-commerce di Google Analytics 4.

Se utilizzi la configurazione dello snippet gtag.js predefinita, gli eventi GA4 verranno inviati a entrambe le proprietà, UA e GA4. Gli eventi GA4 inviati alla proprietà UA verranno tradotti come definito nel riferimento sulla compatibilità degli eventi. Se preferisci un comportamento diverso, puoi utilizzare la funzionalità Raggruppa e instrada i dati di gtag.js per controllare quali eventi vengono inviati alle proprietà UA e GA4. Ad esempio, puoi inviare l'evento purchase a entrambe le proprietà, UA e GA4, ma solo altri eventi e-commerce GA4 alla proprietà GA4.