GA4 ecommerce (gtag.js): Send GA4 events

This guide describes how to migrate an existing gtag.js Universal Analytics ecommerce implementation to use Google Analytics 4 ecommerce events.

Visit the Developer migration center for additional migration guides and resources.

Outcome

The outcome of following this guide is that you will implement Google Analytics 4 ecommerce events for a new GA4 property and use that new implementation to populate your existing Universal Analytics reports. Your existing Universal Analytics implementation will be changed to receive GA4 ecommerce data.

Before you begin

  1. Use the ecommerce migration helper tool to confirm that the following describes your current implementation:

    • You are using a Universal Analytics property
    • Your site uses the gtag.js library to send ecommerce events
  2. Review the migration options for ecommerce implementations to learn about the trade-offs of each option. Confirm that you do indeed want to follow this guide to use Google Analytics 4 ecommerce events for your existing gtag.js Universal Analytics implementation.

  3. Review the Event compatibility reference to learn how UA events are translated when sent to a GA4 property.

Trade-offs and considerations

Review and consider the information below to fully understand the implications of using Google Analytics 4 ecommerce events with your existing gtag.js (Universal Analytics) ecommerce implementation.

Pros Cons
  • Allows you to see ecommerce data in both your GA4 and Universal Analytics reports.
  • Using GA4 events and parameters ensures complete GA4 ecommerce reports.
  • Requires you to change your existing ecommerce events.
  • Not all GA4 events and parameters have equivalents in Universal Analytics. The shipping_tier, discount, currency, location_id, promotion_name, and promotion_id parameters have no Universal Analytics equivalents and will not appear in your Universal Analytics reports.

Implementation

1. Update your ecommerce implementation

Update your existing ecommerce implementation to migrate from using Universal Analytics ecommerce events to Google Analytics 4 events. Once you've completed this step, your Universal Analytics property will be receiving GA4 ecommerce events. Review the Trade-offs and considerations to understand the implications of this update.

To assist with the update, use the following resources:

2. Create and configure a new GA4 property

Once you've updated your ecommerce implementation to send GA4 ecommerce events, complete either of the following options to start sending data to a new Google Analytics 4 property.

Option 1: Use the GA4 Setup Assistant and enable connected site tags

The GA4 Setup Assistant will automatically create a new GA4 property and copy the following settings from your Universal Analytics property: property name, website URL, timezone, and currency settings. It can also enable the connected site tag feature to reuse your existing Universal Analytics gtag.js implementation to load your new GA4 property.

Follow the steps described in GA4 Setup Assistant to create and configure a new Google Analytics 4 property. Ensure you check the Enable data collection using your existing tags option to use the connected site tag feature.

Option 2: Update your gtag.js snippet

  1. Create a new Google Analytics 4 property.
    • Use the GA4 Setup Assistant to add a Google Analytics 4 property. However, uncheck the Enable data collection using your existing tags option when prompted during setup. Alternatively, create a Google Analytics 4 property without the GA4 Setup Assistant. The advantage of using the assistant is that it will copy some basic settings from your Universal Analytics property.
  2. Find the tag ID for the Google Analytics 4 property.
  3. Add the Google Analytics 4 property to your existing gtag.js snippet using the config command with the tag ID.

The following is an example gtag.js snippet that has configured a Universal Analytics and Google Analytics 4 property:

<!-- 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>