Working with a headless Shopify setup

Littledata's server-side tracking is fully compatible with a headless storefront. If you are using Shopify as the ecommerce platform but are not using the Shopify storefront then Littledata's app can still track the checkout steps and purchases out the box.

What headless frameworks are supported?

We have customers using Littledata with the following frameworks:

• Hydrogen (v1 and v2)
• NextJS
• GatsbyJS
• Pack Digital

Which marketing destinations are supported?

Currently we can support:

• Google Analytics
• Meta (Facebook & Instagram)
• TikTok
• Segment

Headless support for Klaviyo is coming early in 2025.

How it works

Our tracking works with a headless store because our app gets checkout updates, orders, refunds and more directly from Shopify's servers, even if the tracking script is not on the checkout or thank you page.

The part that you need to implement is to get the client ID (the cookie identifier) from the pre-checkout page and send it as a checkout attribute to Shopify. This enables our app to link the pre-checkout user session with the customer events from Shopify.

Any pre-checkout events will need to be tracked manually by your developers using gtag or analyticsJS libraries.

We've built a Demo Headless Store and an npm package for headless to make that easier.

Using the Shopify checkout as a cart

If you are using the using the Shopify checkout as a way to persist the cart contents then you'll need to contact us, as add to cart actions may appear as Checkout Started in the analytics destination. This is a side-effect of how we track checkouts.

Next steps

1. See our headless tracking demo
2. Follow installation steps for a headless store
3. See our headless npm package