Shopify site owners will no doubt be using, or at least be familiar with their ‘one-click checkout’ functionality.

It comes with a few benefits, such as:

• Reduced friction to finalise purchase
• Checkout process is super quick
• Customer details typically stored and requested all at once for speed

While this is all great, it does present itself a challenge to site owners from a data tracking perspective. The one-page checkout, identifiable as shop.app, is its own domain. Using Google Tag Manager (GTM) and Google Analytics 4 (GA4), we can get this tracking correctly.

To get started, you’ll need to be setup with the following tools:

• Google Tag Manager
• Google Analytics 4
• (optional) Chrome DevTools with dataLayer tracking such as DataSlayer

What is a variable in GTM?
A variable is a symbol that represents a value that can change

How are variables applied to triggers and tags?
In triggers, variables define filters that specify when a tag should fire. It is essentially whether the user meets the conditions of the trigger or not.

In tags, variables capture dynamic values. The code from the tag is sent through to GA4.

Let’s get right onto setting up a user-defined variable.

1. Open Google Tag Manager
2. Click Variable in the left sidebar
3. In the User-Defined Variables section, click add New

4. Fill in the following information:
   • Variable Type (Choose your variable type selector) = Auto-Event Variable
   • Variable Type = Element URL
   • Component Type = Is Outbound
   • Affiliated Domains = Shop.app
5. Hit Save

Step 2: Setup your tag

Tags are the information that is sent from GTM to GA4 when our trigger conditions are met.

Here is what we’ll need to setup:

1. Click Tags in the left sidebar
2. Click New on the top-right
3. You should now see the Tag Configuration window. Click Tag Type and select Google Analytics: GA4 Event
4. Input your Measurement ID from GA4. You can find this by opening GA4 and navigating to Admin > Data Streams and then copy & pasting your Stream ID.
5. Name your event. In this example I matched the anchor text of the button, “buy_it_now”
6. Set your event parameters and values. I’ve used the following:

Event Parameter	Value
buy_it_now	{{Buy It Now – Outbound Click}}
click_url	{{Click URL}}
click_text	{{Click Text}}
click_element	{{Click Element}}

7. Save your tag

Step 3: Setup your trigger

Directly after creating your tag, you’ll see the option to directly create a trigger. Click on that, and we’ll get started.

1. Trigger Type: Click All Elements
2. This trigger fires on: Some clicks
3. This step is dependant on the anchor text of your shop.app link, so replace what I’ve shared below with your own:
   {{Click Text}} contains BUY IT NOW

Now that you’ve setup your tag and trigger, it is crucial to preview your changes before deploying.

Next to the Submit button on the top-right is the Preview button. Click it and then paste in your website URL. It will look like below:

Step 5: Test and debug your tracking with Tag Assistant

When preview mode is activated, it will open a new tab of your website and it will track all actions, loaded elements, triggers and tags. This is called Tag Assistant.

You will want to navigate to a page that has the one-page checkout button. Once there, click on the button and then go back to the Tag Assistant window.

If successful, you should see results like below:

If unsuccessful, you’ll need to go through some debugging to see if any of the tag event parameters are not being met.

Step 6: Setup a Custom Event in GA4

We need the data that is sent from GTM to GA4 to be correctly labelled.

1. In the bottom-left corner, click Admin
2. Click Events
3. Click Create Event
4. Give your event a name
5. Set your Matching Conditions:

Parameter	Operator	Value
event_name	Equals	buy_it_now

Finally, we want this event to be an available metric in GA4 when we do our own Explorations.

1. In the bottom-left corner, click Admin
2. Click Events
3. Click Custom Definitions
4. Click Custom Metrics
5. Click Create Custom Metric
6. Fill in the details and make sure you assign your ‘buy’ Event Parameter.

I worked through this solution when I saw a big discrepancy between ‘add to carts’ and ‘purchases’ when reviewing my funnel metrics. The number of ‘purchases’ was higher than ‘add to carts’, and I thought that was super weird. I’ve only recently tested this tracking setup, so I do hope it’s the silver bullet to this tracking trouble.

This data is also great for funnel explorations. Below is an example of how this could look in GA4’s Explorations.