E-commerce do GA4 (analytics.js: e-commerce padrão): enviar eventos de e-commerce do GA4

Neste guia, descrevemos como migrar uma implementação atual de e-commerce padrão para a analytics.js (Universal Analytics) com o intuito de usar os eventos de e-commerce do Google Analytics 4.

Acesse a Central de migração do desenvolvedor para ver mais recursos e guias de migração.

Resultado

Se você seguir este guia, sua nova implementação do Google Analytics 4 enviará eventos de e-commerce do GA4 para uma nova propriedade do GA4 e uma propriedade atual do Universal Analytics. A propriedade atual do Universal Analytics receberá dados de e-commerce do GA4, mas os relatórios não serão afetados.

Estas são as duas fases da migração:

Migrar as transações do UA para um evento de compra do GA4
- O e-commerce padrão do Universal Analytics é compatível com o envio de dados de transações e itens. A migração para um evento purchase do Google Analytics 4 oferecerá um recurso equivalente.
(Opcional) Medir outros eventos de e-commerce do GA4
- Implemente outros eventos de e-commerce do GA4 para aproveitar ao máximo os recursos. Por exemplo, visualizações e interações do produto, interações pré-compra e interações de finalização de compra.

Antes de começar

Verifique se as seguintes informações descrevem sua implementação atual:
- Você usa uma propriedade do Universal Analytics.
  - Se a sua propriedade tiver um ID de acompanhamento, ela é do Universal Analytics.
- Seu site usa a biblioteca da gtag.js para enviar eventos de e-commerce.
Consulte as opções de migração para implementações de e-commerce e saiba mais sobre as vantagens e desvantagens de cada uma. Confirme se você realmente quer seguir este guia para usar os eventos de e-commerce do Google Analytics 4 na sua implementação atual do Universal Analytics.
Consulte a referência de compatibilidade de eventos para saber como o evento de compra do GA4 é convertido quando enviado a uma propriedade do UA.

Vantagens, desvantagens e considerações

Leia as informações abaixo para entender completamente as implicações de usar os eventos de e-commerce do Google Analytics 4 com sua implementação de e-commerce do Universal Analytics.

Vantagens	Desvantagens
Veja dados de e-commerce nos relatórios do GA4 e do Universal Analytics. A migração para o evento `purchase` do GA4 gera relatórios completos de e-commerce do UA.	Trabalho adicional para migrar da analytics.js para a gtag.js. É recomendável migrar todas as métricas personalizadas da analytics.js para a gtag.js (por exemplo, eventos, visualizações de página, tempo etc.).

Implementação

1. Migrar a medição do UA da analytics.js para a gtag.js

Para enviar eventos de e-commerce do GA4, você precisa migrar da analytics.js para a gtag.js, incluindo qualquer medição personalizada.

Geralmente, as etapas para concluir a migração incluem o seguinte:

Remova o snippet da analytics.js.
Instale a tag do Google (gtag.js) e configure-a com o ID de acompanhamento da sua propriedade do UA.
Migre o código de medição personalizada da analytics.js para a gtag.js. As seções abaixo descrevem como migrar uma transação de comércio eletrônico padrão. Consulte Migração de medições para receber ajuda geral sobre como migrar outros cenários de medição.

Antes: 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 -->

Depois: tag do 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. Atualizar a implementação de e-commerce para enviar eventos do GA4

Atualize a implementação atual de e-commerce para migrar dos eventos de e-commerce do Universal Analytics para os eventos do Google Analytics 4. Depois que você concluir essa etapa, sua propriedade do Universal Analytics receberá um evento purchase do GA4. Consulte a seção Vantagens, desvantagens e considerações para entender as implicações dessa atualização.

O exemplo abaixo ilustra como migrar um evento de transação de comércio eletrônico padrão da analytics.js para um evento purchase de e-commerce equivalente do GA4, que é compatível com o Universal Analytics.

Antes: transação de e-commerce padrão do UA (analytics.js)

O exemplo a seguir mostra uma implementação de e-commerce padrão da analytics.js para uma transação com dois itens:

// 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');

Depois: compra de e-commerce do GA4 (gtag.js)

Ao migrar um evento de transação da analytics.js para um evento purchase do GA4, as principais diferenças são as seguintes:

O GA4 tem um único evento purchase, que inclui todos os detalhes e itens relacionados à transação. A analytics.js executa vários comandos de e-commerce ga() para capturar as mesmas informações.
O GA4 tem um único campo transaction_id para todo o evento. A analytics.js exige que o ID da transação seja incluído em cada item.
O GA4 tem vários campos de categoria de itens. A analytics.js usa um único campo de categoria com um delimitador / para descrever hierarquias. No entanto, os eventos do GA4 com vários campos de categoria de itens funcionarão na propriedade do UA devido à conversão de parâmetros de 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. Criar e configurar uma nova propriedade do GA4

Depois de atualizar sua implementação de e-commerce para enviar eventos de e-commerce do GA4, escolha uma das opções a seguir para começar a enviar dados a uma nova propriedade do Google Analytics 4.

Opção 1: usar o Assistente de configuração do GA4 e ativar as tags do site conectadas

O Assistente de configuração do GA4 criará automaticamente uma nova propriedade do GA4 e copiará as seguintes configurações da sua propriedade do Universal Analytics: nome da propriedade, URL do site, fuso horário e moeda. Também é possível ativar o recurso de tag do site conectada para reutilizar a implementação atual da gtag.js do Universal Analytics e carregar a nova propriedade do GA4.

Siga as etapas descritas no Assistente de configuração do GA4 para criar e configurar uma nova propriedade do Google Analytics 4. Marque a opção Ativar a coleta de dados usando suas tags existentes para usar o recurso de tag do site conectada.

Opção 2: atualizar seu snippet da gtag.js

Crie uma nova propriedade do Google Analytics 4.
- Use o Assistente de configuração do GA4 para adicionar uma propriedade do Google Analytics 4. No entanto, desmarque a opção Ativar a coleta de dados usando suas tags existentes quando solicitado durante a configuração. Se preferir, crie uma propriedade do Google Analytics 4 sem o Assistente de configuração do GA4. A vantagem de usar o Assistente é que ele copia algumas configurações básicas da sua propriedade do Universal Analytics.
Encontre o ID da tag da propriedade do GA4.
Adicione a propriedade do Google Analytics 4 ao seu snippet atual da gtag.js usando o comando config com o ID da tag.

A seguir, temos um exemplo de snippet da gtag.js que configurou uma propriedade do Universal Analytics e do 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. (Opcional) Medir outros eventos de e-commerce

Para aproveitar ao máximo os relatórios de e-commerce do GA4, implemente outros eventos de e-commerce. Se quiser saber mais, consulte E-commerce do Google Analytics 4.

Se você usar a configuração padrão do snippet da gtag.js, os eventos do GA4 serão enviados às propriedades do UA e do GA4. Os eventos do GA4 enviados para sua propriedade do UA serão convertidos conforme definido na Referência de compatibilidade de eventos. Se preferir um comportamento diferente, você poderá usar a funcionalidade Agrupar e rotear dados da gtag.js para controlar quais eventos serão enviados à sua propriedade do UA e do GA4. Por exemplo, você pode enviar o evento purchase para a propriedade do UA e do GA4, mas enviar outros eventos de e-commerce apenas para a propriedade do GA4.