Shopify Manual Revenue Attribution Recipe
Connect your Shopify storefront and order revenue to SourceTrack using manual snippet placement and Shopify webhooks.
Who This Is For
This guide is for eCommerce developers and shop owners using Shopify who want to track marketing campaigns and attribute purchases back to click channels (like Google Ads or AI referrals) using custom code and Shopify webhook triggers.
Key Terms Defined:
- Theme Liquid (theme.liquid) — the layout file in your Shopify theme that wraps all pages.
- Cart attributes — custom metadata fields stored on a Shopify cart. We use this to save the anonymous visitor ID (
st_aid) so it flows into the final order. - Webhook — an automatic server message sent by Shopify when an action occurs (like
orders/paid). - HMAC validation — a cryptographic handshake that confirms the webhook message was really sent by Shopify.
What You Will Set Up
You will set up storefront visitor tracking by injecting our pixel, save the visitor ID as a cart attribute, and direct Shopify order webhooks to our processing endpoint to stitch conversions.
Steps: Shopify Integration
The complete install, end to end. Steps 6 and 7 are both required: the webhook delivers the order revenue, and the cart attribute is what lets SourceTrack tell you which marketing source earned it.
- In your Shopify Admin, go to Online Store → Themes.
- On your current theme, click the action dropdown (the three dots) and select Edit Code.
- Open the
layout/theme.liquidfile. - Paste the tracking script directly before the closing
</head>tag. - Save
theme.liquid. Shopify publishes the change to your live theme straight away. - Still in your theme, add the cart-attribute snippet so the anonymous visitor ID (
st_aid) is saved onto the Shopify cart and travels with the order. - In Shopify Admin → Settings → Notifications, create an
orders/paidwebhook pointing at/api/webhooks/shopify/YOUR_SITE_KEY. The webhook delivers the order revenue; step 6 is what makes that revenue attributable, so a store with the webhook alone records purchases against no visitor. - In Shopify Admin → Settings → Customer events, click Add custom pixel and paste the checkout pixel snippet to track
checkout_startedevents in Shopify's sandboxed checkout.
Step 1: Storefront Pixel Tracking
Add the standard SourceTrack pixel script to your storefront theme to log UTMs and referrers:
- In your Shopify Admin, go to Online Store → Themes.
- Click the action dropdown (the three dots) and select Edit Code.
- Open the
layout/theme.liquidfile. - Paste the tracking script directly before the closing
</head>tag. ReplaceYOUR_SITE_KEY:
<!-- Paste inside layout/theme.liquid before </head> -->
<script async src="https://api.srctk.com/tracker.min.js" data-site-key="YOUR_SITE_KEY"></script>Step 2: Capture Visitor ID in Shopify Cart
To link checkout purchases with marketing sessions, you must store the anonymous visitor ID (st_aid) as a cart attribute. Add this Javascript snippet to your checkout or cart templates:
// Read st_aid from localStorage and forward as a cart attribute
const visitorId = localStorage.getItem('st_aid');
if (visitorId) {
fetch(window.Shopify.routes.root + 'cart/update.js', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
attributes: {
'st_aid': visitorId
}
})
});
}Step 3: Connect Order Webhooks
Configure a webhook inside Shopify to forward order details to your SourceTrack endpoint on purchase confirmation:
- In your Shopify Admin, go to Settings → Notifications.
- Scroll to the Webhooks section and click Create Webhook.
- Configure the webhook details:
- Event:
orders/paid(recommended) ororders/create. Withorders/create, SourceTrack only processes orders wherefinancial_status === 'paid'— unpaid carts and pending orders are ignored. - Format: JSON
- URL:
https://api.srctk.com/api/webhooks/shopify/YOUR_SITE_KEY - API Version: Latest / stable
- Event:
- Save the webhook, then copy the Shopify signing secret (shared with all webhooks for the shop) and paste it intoIntegrations → Shopify webhook recipe. SourceTrack rejects any webhook whose HMAC-SHA256 signature does not match.
Attribution stitching: the order webhook reads the visitor id fromnote_attributes using the first key it finds among_st_aid, st_aid,anonymous_id, visitor_id,sourcetrack_user_id, orsite_user_id. Step 2 setsst_aid; using one of those other keys also works.
Dedupe: Shopify webhooks are idempotent by Shopify webhook id and order id, so a redelivered webhook will record as duplicate, not a second conversion.
Step 4: Sandboxed Checkout Funnel Pixel
Because Shopify hosts checkout inside an isolated sandbox, standard theme scripts cannot execute there. Add a Custom Pixel in Shopify Admin to capture checkout_started funnel events:
- In your Shopify Admin, go to Settings → Customer events.
- Click Add custom pixel, name it
SourceTrack Checkout, and click Add pixel. - Paste the code snippet below into the code editor:
// In Shopify Admin > Settings > Customer events > Add custom pixel
analytics.subscribe('checkout_started', (event) => {
const checkout = event.data?.checkout;
fetch('https://api.srctk.com/api/track', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
keepalive: true,
body: JSON.stringify({
site_key: 'YOUR_SITE_KEY',
event: 'checkout_started',
properties: {
shopify_source: 'web_pixels',
currency: checkout?.currencyCode,
checkout_total: checkout?.totalPrice?.amount ? Number(checkout.totalPrice.amount) : undefined,
item_count: Array.isArray(checkout?.lineItems) ? checkout.lineItems.length : undefined
}
})
});
});How to Verify It Worked
- Place a test order on your storefront theme using Shopify test checkout methods.
- In the Shopify Admin webhook settings, click Send test notification on your created webhook to verify the connection.
- Go to the SourceTrack dashboard Event Debugger. Verify that a success webhook event logs for the order, and the revenue appears in your overview graphs.
Common Mistakes
- Missing Cart Attribute: If you forget Step 2, Shopify won't store the visitor ID on the cart. Without it, the order webhook cannot stitch the purchase back to the acquisition source, and the conversion will show as unattributed.
- No Storefront Script: Ensure your storefront theme is loaded with the tracking pixel so the visitor ID gets generated and stored.
Next Step
Your Shopify integration is complete! You can explore additional API options or customize dashboard views in ourDeveloper Portal.