How to Set Up GA4 Ecommerce Tracking On Shopify

By now you should know that Google retired Universal Analytics in July 2023, and moved everything to GA4. This means that website owners need to get GA4 set up as soon as possible. For ecommerce websites there’s the added complication of getting ecommerce tracking working in GA4 too. For Shopify stores this process was really simple on Universal Analytics, but is more challenging on GA4.

Read on for an easy process to set up GA4 ecommerce tracking on any Shopify website without needing to install apps or use developers.

To complete this process you’ll need to have both GTM and GA4 already installed on your Shopify store. For help with this, read our guides on How To Install GTM on Shopify and How To Install GA4 on Shopify.

Whilst anyone should be able to follow this guide, it will be easier if you have a basic understanding of how GTM works.

Setting Up Google Analytics 4

Before you can start gathering data about your store, you need to have a Google Analytics account and create a GA4 property. You can then set up Google Analytics 4 tags on your Shopify store, and connect your Google Ads account with your Google Analytics account.

Step 1: Create a Google account and Google Analytics account

You need a Google account to use Google Analytics. If you already use Google products, such as Gmail or Ads, then you can use the same account for Google Analytics.

If you don't already have an account for a Google product, then create a Google account. You don't have to use the Gmail account for anything other than signing in and out of Google Analytics.

After you create a Google account, you need to Create an Analytics account. Then proceed to step 2.

Step 2: Create or move a Google Analytics 4 property

To activate Google Analytics 4, either create a new Google Analytics 4 property to add to your Shopify store, or move an existing property that you previously created.

After you have your property, you need to create a web data stream. Make a note of the Tag ID because you'll use it in Step 3.

Step 3: Add Google Analytics 4 tags

If you don't have the Google & YouTube channel installed, then you're prompted to install it during the set up process for your GA4 tags. You don't have to connect to the Google Merchant Center to complete your GA4 tags setup proces.

Steps:

• From your Shopify admin, got to Online store > Preferences.
• In the Google Analytics section, click Manage pixel here.
• Click Connect your Google account.
• Select the Tag ID for the GA4 property that you want to connect to your Shopify store.
• Click Connect your Google Analytics 4 property.
• After you set up Google Analytics 4 tags, certain ecommerce events are tracked automatically. To learn more about event tracking in Google Analytics 4, refer to Setting up Google Analytics events.

Note Google Analytics can't track events until you remove password protection from your online store.

Step 4: Link your Google Analytics account to your Google Ads account

Linking a Google Analytics property to your Google Ads account helps you to analyse customer activity on your store that you can use to measure conversion actions and create audiences.

Create Data Layer In Shopify

Our first task is to create a data layer. The data layer is a simple bit of code that contains information about a visitor’s website session. This information can then be passed to other platforms such as GTM.

We’ve created a data layer for you that goes on the Shopify order-complete page. It automatically populates itself with information about the customer's order, such as order value, shipping costs and items purchased.

• Copy and paste the script below into the ‘checkout’ scripts field in your Shopify admin settings. This can be found by going to ‘Settings > Checkout & Accounts > Additional Scripts’

• This data layer pushes a ‘purchase’ event to GTM that contains information about the customer's order.

{% if first_time_accessed %}
<script>
  dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
  window.dataLayer.push({
    'event': 'purchase', 
      ecommerce: {
      'transaction_id': '{{ order.name || order.order_number }}',
      'value': {{ total_price | money_without_currency | remove:',' }}, // Includes tax & shipping
      'tax': {{ tax_price | money_without_currency | remove:',' }},
      'shipping': {{ shipping_price | money_without_currency | remove:',' }},
      'currency': '{{ shop.currency }}',
      'payment_type': '{{ order.transactions[0].gateway }}', //optional parameter
      'items': [

      {% for line_item in line_items %}
        {
        'item_id': '{{ line_item.sku || line_item.product_id }}', //if no SKU exists, use product Id
        'item_name': '{{ line_item.product.title }}',
        'discount': {{ line_item.line_level_total_discount | money_without_currency }},
        'item_variant': '{{ line_item.variant.title }}',
        'price': {{ line_item.final_price | money_without_currency }},    
        'quantity': {{ line_item.quantity }}
        },
      {% endfor %}
      ]}
  });
</script>
{% endif %}**

Create Firing Trigger in GTM

Now we need to set up a trigger that fires when customers complete an order. When the trigger fires, the tag that contains the order information is sent to GA4.

We need to define the conditions on which our purchase trigger fires. The condition for our trigger will be when the purchase event in our data layer is pushed. To set this up:

• Log into GTM, go to the left menu and select ‘Triggers’
• Press the blue ‘New’ button
• Call your trigger ‘GA4 - Purchase’
• Press the ‘edit’ icon in the corner of the ‘Trigger Configuration’ window
• Under ‘Choose trigger type’ select ‘Custom Event’
• In the ‘Event name’ field type ‘purchase’
• Set ‘This trigger fires on’ to ‘Some custom events’
• Set the event conditions to:
• Event - Equals - Purchase

When you’re finished, it should look like this:

Create Data Layer Variables in GTM

Before we set up our tag, we need to create GTM variables to grab information from our data layer. If variables are new to you, think of them as packets that contain small bits of information.

Specific values from the data layer are added into these variables, and these are then sent to GA4.

We need to create variables to extract the following values from your datalayer:

• Order Revenue

• Order ID

• Currency

• Tax

• Shipping Costs

• Items Purchased

• In GTM, from the left menu click into the ‘Variables’ page

• In the ‘User-Defined Variables’ box click on the ‘New’ button

• On this screen you can create a new GTM variable. You need to do the following process for each of the variables listed above. The details for each individual variable is listed below:

Order Revenue

Name: dlv - Thank You Page - Order Revenue

Variable Configuration:

Variable Type: Data Layer Variable

Data Layer Variable Name: ecommerce.value

Order ID

Name: dlv - Thank You Page - Order ID

Variable Configuration:

Variable Type: Data Layer Variable

Data Layer Variable Name: ecommerce.transaction_id

Currency

Name: dlv - Thank You Page - Currency

Variable Configuration:

Variable Type: Data Layer Variable

Data Layer Variable Name: ecommerce.currency

Tax

Name: dlv - Thank You Page - Tax

Variable Configuration:

Variable Type: Data Layer Variable

Data Layer Variable Name: ecommerce.tax

Shipping Costs

Name: dlv - Thank You Page - Shipping

Variable Configuration:

Variable Type: Data Layer Variable

Data Layer Variable Name: ecommerce.shipping

Items Purchased

Name: dlv - Thank You Page - Items

Variable Configuration:

Variable Type: Data Layer Variable

Data Layer Variable Name: ecommerce.items

Each variable should look similar to this when complete:

Create Ecommerce Tags in GTM

To pull ecommerce data into GA4, GTM needs to fire a tag on the order-complete page. This tag contains information about each order and is used to populate the GA4 reports.

• Go back into GTM and from the left menu click into ‘Tags’
• Press the blue ‘New’ button
• Name your tag ‘GA4 Purchase’
• In the ‘Tag Configuration’ box press the edit icon in the top right corner
• Select ‘Google Analytics: GA4 Event’
• In the ‘Configuration Tag’ field, select your ‘GA4 Config’ tag.
• In the ‘Event Name’ field, enter “purchase”
• Expand the ‘Event Parameters’ drop down menu and press ‘Add Row’

Event parameters are bits of information about the order that we want to pull through to GA4 when the tag fires. Think of event parameters as the individual elements of a customer order (such as order value, shipping costs etc). Each of these elements need to be added as an event parameter against the purchase event tag.

To set these up, click the ‘Add Row’ button. Each row has two fields

• Parameter Name - The official name of the parameter defined by GA4. When a purchase event fires with one of GA4’s defined purchase parameters, GA4 will recognise it. For example, ‘transaction_id’, ‘tax’ and ‘shipping’ are both recognised purchase parameters. A full list of available purchase event parameters can be viewed here.

• Value - The actual value of the parameter. This will be a dynamic value based upon the customer ordere. Using the example parameters above, these could be:

transaction_id: #245

tax: 2.56

shipping: 3.99

The event parameter values are dynamic bits of information from your data layer. Remember the data layer variables we created earlier? It’s those variables which are used to populate the event parameter values.

Click the icon to the right hand side of the ‘value’ field. This will load a screen where you can select a variable. Find and select the correct variable for this parameter (it will be one of the ones you created earlier that begins with “dlv”).

Do this for the following parameters:

When complete, your screen should look like this:

Debugging

Finally, we need to test that our tag setup is working. To do this:

• Go into GTM and press the ‘Preview’ button in the top right corner
• Follow the steps to activate GTM preview mode on your store
• Once complete it will take you to the front end of your store with a tag assistant window in the corner

The previous tab (titled “Tag Assistant [Connected]) will now report on the tags that fire as you browse your site in the preview tab.

• Open your GA4 account and in the left menu go to ‘Configure > DebugView’
• Go back to the tab that previews your store front end and put through a test transaction
• Finally, go into the GA4 DebugView tab. If the GA4 purchase tag has successfully fired, you’ll see a green purchase event in the timeline. Click into this event and the window on the right will populate with information about the order.

Publish GTM Changes

Once you’re happy that transactions are captured within your GA4 ecommerce tracking, you can go ahead and publish your GTM changes. After publishing, we recommend paying close attention to both your GA4 account and your UA account to make sure that orders are recorded as you would expect.

Thanks for reading our guide - we hope it helped you get set up. If you need any further advice or help with your Shopify store, marketing or SEO, drop us a message and one of our team will get in touch.

If you enjoyed this guide, why not check out our 2023 Ultimate Guide to SEO on Shopify? Written by our team of SEO experts, it's packed full of useful tips and methods to improve your store's search performance, grow traffic and increase sales. Click the button below to have it emailed direct to you.

To stay up to date with all things ecommerce, make sure you subscribe using the form below to receive our weekly newsletters, guides and advice.