How to add analytics to a Shopify store

No app is required: theme.liquid is the layout every storefront page renders through. Be aware of two Shopify-specific limits before you rely on the numbers. First, theme edits belong to that theme — if you switch themes or install a new version, add the tag again. Second, checkout and the thank-you page only allow Shopify web pixels, which run inside a sandboxed iframe; VisitTrack's script deliberately doesn't run inside iframes, so it can't track checkout steps there.

How to install VisitTrack on Shopify

1. 1

   Step 1: Copy your site id

   Add your store's domain as a site in VisitTrack and copy the snippet from the install step (or Settings → General). Replace SITE_ID below.

2. 2

   Step 2: Open the theme code editor

   In Shopify admin, go to Online Store → Themes. On your live theme, click ⋯ → Edit code. (Tip: duplicate the theme first if you want a backup.)

3. 3

   Step 3: Paste the tag before </head> in theme.liquid

   Under Layout, open theme.liquid, find the closing </head> tag and paste the snippet just above it. Click Save.

   layout/theme.liquidCopy

   <script defer data-site="SITE_ID" src="https://visitrack.app/tracker.js"></script>

4. 4

   Step 4: Allow your store domains

   Visitors may reach both your-store.myshopify.com and your custom domain. Both report into the same VisitTrack site. In Settings → General → Allowed hostnames, save the hosts you want counted (for example yourstore.com and *.yourstore.com).

How to check VisitTrack is working on Shopify

1. Open your storefront in a private window (so you're not looking at the theme editor preview) and open a collection and a product.
2. The VisitTrack live view shows you within seconds; the Pages tab lists /collections/… and /products/… paths.
3. If nothing arrives, view the page source and search for tracker.js — if it's missing, the tag was saved in a theme that isn't the published one.

Does VisitTrack track Shopify page navigation?

Shopify storefronts are classic multi-page sites: each page is a full load and a pageview. Pageviews are recorded by path, so /collections/shoes?page=2 and /collections/shoes?sort_by=price-ascending count toward /collections/shoes, which keeps collection stats readable.

Some themes update the URL when a shopper picks a variant (?variant=…). That only changes the query string, so it isn't counted as a new pageview.

How to track custom events and goals in Shopify

Add data-vt-goal to the buttons that matter, in the theme code. In Dawn-based themes the add-to-cart button lives in snippets/buy-buttons.liquid and the cart's checkout button in sections/main-cart-footer.liquid; other themes use similar names — search the code editor for name="add" and name="checkout".

With automatic events on, product forms also record a form_submit event, but its name comes from the form's id, which varies by template — explicit goals are easier to read.

<button type="submit" name="add" data-vt-goal="add_to_cart" class="product-form__submit button">
  Add to cart
</button>

<button type="submit" name="checkout" data-vt-goal="checkout_started" class="cart__checkout-button button">
  Check out
</button>

Create goals from add_to_cart and checkout_started in Settings → Goals, and a funnel from product page → add_to_cart → checkout_started → purchase (below).

Revenue attribution on Shopify

VisitTrack's Revenue tab reads payments from Stripe, Polar, Lemon Squeezy, Paddle and Razorpay webhooks; Shopify Payments isn't one of them. You can still connect orders to sources with two small pieces: store the visitor id on the cart as a cart attribute (Shopify copies cart attributes onto the order as note_attributes), then send a purchase event from your own orders/paid webhook handler with server-side events.

The event joins the visitor's history, so purchase works as a goal and funnel step broken down by first source. It won't appear as revenue in the Revenue tab. In cookieless mode there's no browser visitor id to store, so this pattern needs standard mode.

<script>
  // Store the VisitTrack visitor id on the cart, once per session, so it
  // travels with the order (as a note attribute) into your webhook.
  document.addEventListener("DOMContentLoaded", function () {
    var vid = window.visitrack && window.visitrack.visitorId && window.visitrack.visitorId();
    if (!vid || sessionStorage.getItem("vt_cart_attr") === vid) return;
    fetch("/cart/update.js", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ attributes: { visitrack_visitor_id: vid } }),
    }).then(function () { sessionStorage.setItem("vt_cart_attr", vid); });
  });
</script>

// Your orders/paid webhook handler (verify X-Shopify-Hmac-Sha256 first)
const order = JSON.parse(rawBody);
const vid = order.note_attributes?.find((a) => a.name === "visitrack_visitor_id")?.value;

if (vid) {
  await fetch("https://visitrack.app/api/track", {
    method: "POST",
    headers: {
      Authorization: `Bearer ${process.env.VISITRACK_API_KEY}`,
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      type: "event",
      visitorId: vid,
      name: "purchase",
      props: {
        amountCents: Math.round(Number(order.total_price) * 100),
        currency: order.currency,
        order: order.name,
      },
    }),
  });
}

Script options you might need on Shopify

All optional — add them to the same tag. Full reference: script configuration.

Shopify troubleshooting

Not on Shopify? See all 29 integration guides.