> For the complete documentation index, see [llms.txt](https://help.littledata.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.littledata.io/sources/shopify/shopify-checkout-extensibility.md).

# Tracking the Shopify checkout

How Littledata tracks Shopify checkout steps server-side, which events it sends, and when each one is triggered.

This guide explains Littledata's Shopify checkout funnel events: what they are called, when they are triggered and how they work. It covers GA4 and Segment.

### Server-side checkout tracking

Since Shopify moved stores to Checkout Extensibility, it has become harder to track checkout steps and purchases.

One option is to use Customer Events (Web Pixels) to add tracking code to the checkout pages. This is hard to maintain and has [technical limitations](https://blog.littledata.io/2023/06/05/shopify-web-pixel-why-how-tracking/).

Littledata instead tracks checkout updates from Shopify's servers and works out how the customer moved through the checkout. This works for:

* The Shopify checkout, including checkout extensions. The events are the same for the [one-page checkout](https://help.shopify.com/en/manual/checkout-settings/customize-checkout-configurations/one-page-checkout) and the three-step checkout.
* Accelerated checkouts, such as Shop Pay and Amazon.

If your checkout uses apps for subscriptions or upsells, the checkout steps are the same. Only the [resulting order is labeled differently](https://help.littledata.io/sources/shopify/tracking-subscription-orders-in-the-shopify-checkout).

### Why track the checkout with Littledata

* No code to add. Tracking is set up automatically.
* No tracking code for you to update when Shopify, Google or Meta change their APIs.
* Tracks customers who use ad blockers or have network limits.
* Works for headless sites that use a Shopify checkout. Follow the [headless setup guide](https://help.littledata.io/sources/shopify/headless-shopify/working-with-a-headless-shopify-setup) first.

### Checkout step triggers (GA4)

Littledata sends a GA4 event each time the checkout reaches a new step:

| Step     | GA4 event name      | Triggered when                                              |
| -------- | ------------------- | ----------------------------------------------------------- |
| 1        | `begin_checkout`    | A checkout is created in Shopify for the cart               |
| 2        | `add_shipping_info` | A shipping method (shipping lines) is added to the checkout |
| 3        | `add_payment_info`  | A payment method (gateway) is added to the checkout         |
| Purchase | `purchase`          | The order is created in Shopify                             |

See how this looks in the [GA4 checkout funnel](https://help.littledata.io/integrations/shopify-to-google-analytics/checkout-funnel-steps).

### Accelerated checkouts

Littledata tracks purchases from one-click checkouts like Shop Pay, sends them to your destinations and attributes them to the original source.

These checkouts may not have all checkout steps, because a one-click checkout skips most of the standard Shopify checkout.

### Order status page domain

By default, the order status page is hosted on shopify.com. This causes a cross-domain tracking issue, so we recommend using a subdomain of your store (for example, myaccount.mydomain.com) for the order status page.

<div data-with-frame="true"><figure><img src="https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F1QhTbrMraNWciQeDvu1b%2Fuploads%2Fgit-blob-6fee1590c26e41b6740bcabbd1a2f8e4d11256c5%2Forder_status_page_domain.png?alt=media" alt="Shopify banner suggesting a change to the order status page domain"><figcaption></figcaption></figure></div>

{% stepper %}
{% step %}
**Add a CNAME record**

Ask whoever manages your DNS records to add a CNAME record for the subdomain, pointing to `shops.myshopify.com`.
{% endstep %}

{% step %}
**Register the subdomain in Shopify**

In your Shopify admin, go to **Settings** > **Domains** and add the subdomain.
{% endstep %}
{% endstepper %}

### How server-side checkout tracking works

For security reasons, apps like Littledata can't load third-party JavaScript (such as gtag or the Meta Pixel) on Shopify's checkout. Instead, Littledata uses Shopify's checkout update webhooks to work out which steps a customer reached.

When a customer moves through the checkout quickly, Shopify may only send the latest state of the checkout. Passing these raw updates on would give a checkout funnel that doesn't make sense, with more people at later steps than earlier ones. For example:

| Funnel step                | Sessions |
| -------------------------- | -------- |
| Contact information        | 2,091    |
| Shipping information       | 613      |
| Payment method             | 920      |
| Sessions with transactions | 1,245    |

To avoid this, Littledata remembers the last step it sent for each checkout in your store for 3 days. When a new checkout update arrives, Littledata sends every step between the last one sent and the current one.

For example, a logged-in customer gets to the payment step very quickly, and Shopify only reports that a payment method was added. Littledata sends three events:

1. `begin_checkout` (added by Littledata)
2. `add_shipping_info` (added by Littledata)
3. `add_payment_info` (from the Shopify update)

#### Trade-offs

Filling in missing steps makes the funnel much more useful, but keep these points in mind when you analyze the data:

* If a customer really did skip a step, Littledata still sends it, so the funnel can show steps that didn't happen.
* If a checkout is updated more than 3 days after the last step was sent, Littledata no longer remembers it and sends the steps again. This can create duplicate events. A 3-day window covers most checkouts for most stores.

### Segment destination

Littledata sends these Segment events as the checkout moves forward:

| Triggered when                              | Segment events                                                                                 |
| ------------------------------------------- | ---------------------------------------------------------------------------------------------- |
| A checkout is created                       | Checkout Started, Checkout Step Viewed (step 1)                                                |
| A shipping method (shipping lines) is added | Checkout Step Completed (step 1), Checkout Step Viewed (step 2)                                |
| A payment method (gateway) is added         | Checkout Step Completed (step 2), Checkout Step Viewed (step 3), Payment Info Entered (step 3) |
| The checkout is completed                   | Checkout Step Completed (step 3)                                                               |
| The order is created                        | Order Completed                                                                                |

Missing steps are filled in the same way as for GA4.

{% hint style="info" %}
The Thank you Page Viewed event is no longer sent. Shopify's new checkout doesn't allow script tags to load on the checkout.
{% endhint %}

### Related articles

* [Tracking Shopify checkout steps in Google Analytics](https://help.littledata.io/integrations/shopify-to-google-analytics/checkout-funnel-steps)
* [Tracking subscription orders in the Shopify checkout](https://help.littledata.io/sources/shopify/tracking-subscription-orders-in-the-shopify-checkout)
* [Tracking post-purchase upsells on Shopify](https://help.littledata.io/sources/shopify/tracking-post-purchase-upsells-in-the-shopify-checkout)
* [How it works: Shopify source for Segment](https://help.littledata.io/integrations/shopify-to-segment/how-it-works)