Shopify

Track purchase conversions from your Shopify store automatically via webhooks. No JavaScript in the checkout, no pixel, no sandbox limitations.

How It Works

Customer completes purchase on Shopify checkout
        |
Shopify sends webhook (server-to-server)
        |
TraceLog API receives and stores conversion event
        |
Purchase appears in your TraceLog dashboard

Prerequisites

• A TraceLog account with a project configured for your store domain
• Admin access to your Shopify store

Step 1: Install the Tracking Script

Add the TraceLog script to your Shopify theme to track browsing behavior. In your Shopify admin, go to Online Store > Themes > Edit Code and add the following before </head> in theme.liquid:

<script src="https://cdn.jsdelivr.net/npm/@tracelog/lib@latest/dist/browser/tracelog.js"></script>
<script>
  tracelog.init({
    integrations: {
      tracelog: {
        projectId: "PROJECT_ID",
        shopify: true,
      },
    },
  });
</script>

Replace PROJECT_ID with your actual project ID from the TraceLog dashboard.

The shopify: true option enables automatic session linking — TraceLog writes the session ID to Shopify's cart attributes so that webhook purchases can be connected back to the customer's browsing session. This is what powers campaign attribution (see Step 4).

tip

Use the data-tlog-ignore attribute on any form fields that contain sensitive customer data (e.g., email, phone, address). TraceLog's PII sanitization catches most cases automatically, but this attribute provides an explicit guarantee.

Step 2: Configure the Webhook in Shopify

1. Go to Shopify Admin > Settings > Notifications
2. Scroll down to Webhooks and click Create webhook
3. Configure:
   • Event: Order payment
   • Format: JSON
   • URL: https://api.tracelog.io/webhooks/shopify/orders/paid
4. Click Save
5. Copy the Webhook signing secret that Shopify displays
6. In the TraceLog dashboard, go to Project Settings > Shopify Webhook Secret and paste the signing secret

Step 2b: Create the Refund Webhook

1. In the same Webhooks section, click Create webhook again
2. Configure:
   • Event: Order refund
   • Format: JSON
   • URL: https://api.tracelog.io/webhooks/shopify/orders/refunded
3. Click Save (uses the same signing secret)

Refunds (full and partial) will be subtracted from revenue automatically.

Step 3: Configure Conversion Tracking in TraceLog

For purchases to appear in your conversion KPIs and revenue dashboards:

1. Go to the Events page in your project dashboard
2. Find the purchase event (it appears after the first order is received) and set its type to Conversion
3. Go to Revenue Tracking and configure:
   • Event name: purchase
   • Value source: Event field > value

Step 4: Campaign Attribution

When shopify: true is enabled (see Step 1), TraceLog automatically links each purchase to the customer's browsing session. This is how revenue gets attributed to the campaign that originated the visit.

Customer arrives from campaign (utm_source=meta&utm_medium=cpc)
        |
TraceLog captures UTM parameters in the session
        |
shopify: true writes session ID to cart attributes automatically
        |
Customer completes purchase → Shopify sends webhook
        |
TraceLog matches webhook to session → purchase inherits campaign data
        |
Revenue appears under the correct campaign in your dashboard

info

Without session linking, purchases are stored as events but won't appear in conversion KPIs, revenue dashboards, or campaign analytics. The AI Copilot can still surface them when you ask.

With session linking (shopify: true), purchases attach to the customer's browsing session and appear in all conversion, revenue, and campaign metrics.

Session linking is handled entirely by the library — no extra snippets needed. It works with standard carts, AJAX/dynamic carts, and "Buy Now" flows, since it writes the session ID to Shopify's cart attributes via the storefront API on every session start.

note

Accelerated checkouts (Shop Pay, Apple Pay, Google Pay) bypass the storefront cart entirely and cannot carry cart attributes. Purchases from these flows are still recorded as conversion events, but without session linking.

What Gets Tracked

Each purchase creates a custom event with name purchase containing:

Field	Example
value	89.99
order_id	5123456789
order_name	#1042
total_price	89.99
currency	EUR
item_count	3
items	Array with name, quantity, price, sku, product_id
financial_status	paid
shipping_country	ES

Domain Matching

TraceLog matches the webhook to your project using the shop domain. The www. prefix is stripped automatically -- www.my-store.com and my-store.com resolve to the same project.

• If you use a custom domain (e.g., my-store.com), configure that as your project domain in TraceLog
• If you use the default Shopify domain (e.g., my-store.myshopify.com), configure that instead

You can check what Shopify sends by looking at the webhook delivery logs in Shopify Admin > Settings > Notifications > Webhooks.

Verification

After setup, place a test order and check:

1. Shopify side: Go to Settings > Notifications > Webhooks and verify the delivery shows 200 OK
2. TraceLog side: The purchase event should appear in your dashboard as a custom event named purchase

tip

If the webhook returns 404, verify the domain in your TraceLog project matches the Shopify shop domain.

Idempotency

The same order will never be recorded twice. Each order and refund is deduplicated automatically using Shopify's identifiers. Duplicate webhook deliveries (which Shopify may send on retries) are safely ignored. Multiple partial refunds on the same order are supported.

Currency

warning

TraceLog logs a warning when the webhook currency does not match the project's configured revenue currency. Ensure your Shopify shop currency matches the currency configured in Revenue Tracking settings to avoid mismatched revenue data.