Platform Guides

Shopify Integration

Set up Anacoic on your Shopify store in under 10 minutes

Doc #3

This guide walks you through setting up Anacoic server-side tracking on your Shopify store. No coding required for basic setup.

Prerequisites

  • Shopify store (any plan)
  • Anacoic account
  • Meta Pixel ID (if tracking Facebook ads)

The quickest way to install Anacoic on Shopify.

Step 1: Get Your Anacoic Snippet

  1. Log in to your Anacoic Dashboard
  2. Create a new gateway (or use existing)
  3. Go to the Installation tab
  4. Copy the One-Line snippet:
<script src="https://edge.anacoic.com/v1/ana.js"
        data-gateway="YOUR_GATEWAY_ID"
        data-emq="optimize"></script>

Step 2: Add to Shopify Theme

  1. In Shopify Admin, go to Online Store → Themes
  2. Click Customize on your active theme
  3. Click the Theme settings (gear icon) in the left sidebar
  4. Select Custom code or Custom CSS/JS (varies by theme)
  5. Paste your Anacoic snippet in the Head section
  6. Click Save

Step 3: Verify Installation

  1. Visit your store homepage
  2. Open browser DevTools (F12)
  3. Go to Network tab
  4. Filter for “anacoic” or “edge.anacoic”
  5. Refresh the page
  6. You should see a request to edge.anacoic.com/track

Method 2: Shopify Custom Liquid

For more control over where the tracker loads.

Add to Theme.liquid

  1. Go to Online Store → Themes → Edit code
  2. Find layout/theme.liquid
  3. Find the <head> section
  4. Paste your snippet right before </head>:
<!-- Anacoic Tracking -->
<script src="https://edge.anacoic.com/v1/ana.js"
        data-gateway="YOUR_GATEWAY_ID"
        data-emq="optimize"></script>
  1. Click Save

Method 3: Google Tag Manager

If you already use GTM on your Shopify store.

Create the Tag

  1. Open Google Tag Manager
  2. Click Tags → New
  3. Name it “Anacoic Base Tracker”
  4. Tag Type: Custom HTML
  5. Paste your One-Line snippet
  6. Trigger: All Pages
  7. Save and Submit

Test in Preview Mode

  1. Click Preview in GTM
  2. Enter your store URL
  3. Check that the Anacoic tag fires on page load

Tracking Purchase Events

Ad platforms match a purchase to a person using the identifiers you send with it (match keys). Pass the customer data you collected at checkout, with consent.

Using Shopify’s dataLayer (Shopify Plus)

If you have Shopify Plus with checkout customization:

// On order confirmation page
anacoic.track({
  event_name: 'Purchase',
  event_id: 'order_{{ order.id }}', // same ID on browser and server events so platforms deduplicate
  user: {
    email: '{{ customer.email }}',
    phone: '{{ customer.phone }}'
  },
  custom_data: {
    value: {{ order.total_price | money_without_currency }},
    currency: '{{ shop.currency }}',
    transaction_id: '{{ order.id }}'
  }
});

Using Additional Scripts

For standard Shopify plans, add to Settings → Checkout → Additional scripts:

<script src="https://edge.anacoic.com/v1/ana.js"
        data-gateway="YOUR_GATEWAY_ID"
        data-emq="optimize"></script>
<script>
  // Wait for tracker to load
  setTimeout(function() {
    if (window.anacoic) {
      window.anacoic.track({
        event_name: 'Purchase',
        user: {
          email: '{{ order.email }}'
        },
        custom_data: {
          value: {{ order.total_price | divided_by: 100.0 }},
          currency: '{{ order.currency }}'
        }
      });
    }
  }, 1000);
</script>

Sending Match Keys

Match keyHow it’s sent
Emailuser.email from the customer object (hashed with SHA-256 at the edge)
Phoneuser.phone from the customer object, E.164 format
External IDuser.external_id: the Shopify customer ID
Meta browser ID (_fbp)Captured automatically from the cookie
Meta click ID (_fbc)Captured automatically from the cookie or the fbclid parameter
IP address and user agentAdded automatically at the edge
scores how well it can match your events (Event Match Quality) in Events Manager → Data sources → your dataset. Anacoic shows which match keys your events actually carry under Diagnostics → Signal quality.

Optimal Implementation

anacoic.track({
  event_name: 'Purchase',
  user: {
    email: '{{ customer.email }}',
    phone: '{{ customer.phone }}',
    external_id: '{{ customer.id }}'
  },
  custom_data: {
    value: {{ order.total_price }},
    currency: '{{ shop.currency }}'
  }
});

Common Shopify Issues

Issue: Events Not Firing

Solution: Check theme’s Content Security Policy

Some themes block external scripts. Add this to your CSP:

script-src 'self' https://edge.anacoic.com;
connect-src 'self' https://edge.anacoic.com;

Issue: Customer Data Not Available

Solution: Check liquid object availability

Not all customer data is available on all pages:

  • {{ customer }} - Only available when logged in
  • {{ order }} - Only available on order/confirmation pages
  • {{ checkout }} - Only available during checkout

Issue: Duplicate Events

Solution: Use one stable event ID per order

Give every event for the same order the same event_id, in the browser and on the server, so the platform can recognise the copies as one purchase:

event_id: 'order_{{ order.id }}'

Don’t add timestamps or random values to the ID: every copy then looks like a different purchase and gets counted twice.

Shopify-Specific Features

Automatic Customer Detection

The Anacoic tracker can auto-detect logged-in Shopify customers:

<script>
  window.anacoic_config = {
    gateway_id: 'YOUR_GATEWAY_ID',
    emq: 'optimize',
    auto_identify: true  // Detects Shopify customer object
  };
</script>
<script src="https://edge.anacoic.com/v1/ana.js"></script>

Product View Tracking

Track product views for dynamic ads:

// On product page
anacoic.track({
  event_name: 'ViewContent',
  custom_data: {
    content_name: '{{ product.title }}',
    content_type: 'product',
    content_ids: ['{{ product.id }}'],
    value: {{ product.price | divided_by: 100.0 }},
    currency: '{{ shop.currency }}'
  }
});

Next Steps

  1. Configure Meta CAPI integration
  2. Set up Agent Gateway for AI discoverability
  3. Add custom domain for maximum reliability

Getting Help

No analytics or marketing tags load until you opt in.

We use a first-party consent setting to remember your choice. If you allow analytics or marketing, Google Tag Manager can load the tags configured for this site. You can change the decision any time from the footer.