Snapchat CAPI (Conversions API) improves conversion measurement accuracy and reliability in OpenCart by enabling server-side event transmission. This setup combines both browser-based Pixel tracking and server-side CAPI via GTM Server.

---

🧰 Prerequisites

• OpenCart 3.x/4.x site
• GTM Web + Server Containers
• Snapchat Business Manager (Pixel ID + CAPI Token)
• HTTPS-enabled site
• Email and phone hashing logic (SHA-256)

---

🧱 Step 1: Install Snapchat Pixel in GTM Web

1. Open GTM Web > New Tag
2. Tag Type: Custom HTML
3. Trigger: All Pages

<!-- Snapchat Pixel Base Code -->
<script type="text/javascript">
  (function(w,d,s,u,n,a,m){w['SnapPixelObject']=n;w[n]=w[n]||function(){
  (w[n].q=w[n].q||[]).push(arguments)};a=d.createElement(s);
  m=d.getElementsByTagName(s)[0];a.async=1;a.src=u;m.parentNode.insertBefore(a,m);
  })(window,document,'script','https://sc-static.net/scevent.min.js','snaptr');

  snaptr('init', 'YOUR_PIXEL_ID');
  snaptr('track', 'PAGE_VIEW');
</script>

---

💳 Step 2: Push Purchase Event from OpenCart

In success.twig after order placement:

<script>
dataLayer = dataLayer || [];
dataLayer.push({
  event: 'purchase',
  transaction_id: '{{ order_id }}',
  value: {{ order_total }},
  currency: '{{ currency }}',
  email: '{{ email | lower | sha256 }}',
  phone: '{{ phone | regex_replace('/\D/', '') | sha256 }}',
  event_id: 'sc_{{ order_id }}'
});
</script>

---

🌐 Step 3: Send Data to Server via GTM Web Tag

Create a Custom HTML tag:

• Trigger: Event equals purchase

<script>
fetch('https://gtm.yourdomain.com/event', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    event_name: 'PURCHASE',
    event_id: '{{DL - event_id}}',
    transaction_id: '{{DL - transaction_id}}',
    currency: '{{DL - currency}}',
    value: '{{DL - value}}',
    email: '{{DL - email}}',
    phone: '{{DL - phone}}'
  })
});
</script>

---

📡 Step 4: Create Snapchat CAPI Tag in GTM Server

1. Trigger: event_name equals PURCHASE
2. Tag Type: HTTP Request

POST https://tr.snapchat.com/v2/conversion
{
  "pixel_id": "YOUR_PIXEL_ID",
  "event_type": "PURCHASE",
  "event_conversion_type": "WEB",
  "timestamp": {{timestamp}},
  "event_tag": "purchase_event",
  "user": {
    "email": "{{email}}",
    "phone": "{{phone}}"
  },
  "price": {{value}},
  "currency": "{{currency}}",
  "event_id": "{{event_id}}"
}

---

🔁 Step 5: Deduplication Logic

• Use a consistent event_id across both pixel and server event
• Snapchat handles deduplication using this field

---

🔐 Step 6: Consent Control

Implement CMP logic to fire server + pixel tracking only after consent is granted.

---

🧪 Step 7: Testing & Debugging

Platform	Tool
GTM	Preview (Web + Server)
Snapchat Ads	Events Manager
Browser Console	Verify network + pixel call

---