TagGuidesShopify

Shopify

Shopify needs a two-part setup:

  1. Storefront — install tag.min.js like any other site (direct JS or GTM). It captures the click token from the landing URL and stores it in a cookie on your apex domain (e.g. .yourshop.com).
  2. Checkout — the checkout page runs inside a sandboxed Web Pixels API context where tag.min.js can’t reach. We use Shopify’s Custom Pixel API to read the cookie via browser.cookie.get() and POST the conversion to Thrad directly.

1. Install the Tag on your storefront

Same as any other site — pick one path:

  • Direct JS — follow Install, pasting the snippet into theme.liquid (above </head>).
  • GTM — follow the GTM guide. The loader tag fires on All Pages of the storefront.

The Tag stores the click token in a cookie called thrad_click on your apex domain so checkout can read it.

2. Add the Custom Pixel for checkout

In Shopify Admin → Settings → Customer events → Add custom pixel, name it thrad pixel, and paste:

thrad pixel.js
analytics.subscribe("checkout_completed", async (event) => {
  try {
    const raw = await browser.cookie.get("thrad_click");
    if (!raw) {
      // No cookie = organic visitor, not an attributable conversion. Skip.
      return;
    }
 
    let token;
    try {
      token = JSON.parse(decodeURIComponent(raw));
    } catch {
      return;
    }
 
    if (!token.clickId || !token.exp || !token.sig) {
      return;
    }
 
    const checkout = event.data.checkout || {};
    const payload = {
      tag_id:   "<YOUR_TAG_ID>",
      order_id: (checkout.order && checkout.order.id) || checkout.token,
      value:    checkout.totalPrice && checkout.totalPrice.amount,
      currency: checkout.totalPrice && checkout.totalPrice.currencyCode,
      click_id: token.clickId,
      exp:      Number(token.exp),
      sig:      token.sig,
    };
 
    await fetch("https://events.thrad.ai/v1/conversion", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify(payload),
      keepalive: true,
    });
  } catch {
    // Swallow errors — pixel failures must never break checkout.
  }
});

Replace <YOUR_TAG_ID> with the tag ID Thrad sent you.

Save the pixel and toggle it to Connected.

Google Tag ManagerFramer