GA4 ecommerce (gtag.js): Send Universal Analytics events

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

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

Outcome

The outcome of following this guide is that your existing Universal Analytics implementation will be used to populate a new Google Analytics 4 property. Your existing Universal Analytics implementation will remain unchanged, your UA ecommerce reports will continue to be populated with data, and your new Google Analytics 4 property will begin receiving 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 your existing gtag.js Universal Analytics implementation for Google Analytics 4.

  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 your existing gtag.js (Universal Analytics) ecommerce implementation with a Google Analytics 4 property.

Pros Cons
  • Easiest option to implement since you don't change your existing ecommerce event tags.
  • Allows you to see ecommerce data in both your GA4 and Universal Analytics reports.
  • No change to how your ecommerce data is collected or reported in your Universal Analytics property.
  • select_content, checkout_progress, set_checkout_option, and view_refund events are not recognized in GA4 and will not appear in GA4 ecommerce reports.
    • The events above and their associated parameters will be treated as custom events and custom parameters in GA4. However, data will not be sent to Google Analytics for the items parameter (it is not supported as a custom parameter).
  • The Add Shipping Info step in the GA4 Cart Detail/Fallout Funnel report will be empty.
  • The List Clicks step in the GA4 Merch/Product/Item List Funnel report will be empty.
  • The / delimiter for category is not recognized in GA4. GA4 will report cat1/cat2/cat3 as a category instead of three categories, i.e. cat1, cat2, and cat3.

Implementation

Complete either of the following options to use an existing gtag.js Universal Analytics implementation to send ecommerce events to a 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 Measurement 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 Measurement 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>