Squarespace Commerce: OpenAI Ads Pixel and CAPI for Squarespace Commerce: Complete Setup
If you sell physical or digital goods on Squarespace Commerce, tracking ad attribution can be deceptively tricky. Squarespace gives you a convenient "Code Injection" settings panel, so dropping in a basic tracking pixel takes about two minutes. But that's where most store owners stop, and that's why their numbers don't add up.
Here is the problem: when customers purchase using payment options like Afterpay, Apple Pay, or PayPal, they frequently navigate away before Squarespace finishes rendering the Order Status page. If they use a privacy-focused browser or an ad blocker, the confirmation tag never executes at all.
You end up paying for ad clicks on ChatGPT while your reporting shows zero sales.
To build an attribution pipeline that doesn't leak revenue, you need a hybrid setup: Squarespace Code Injection on the front end, paired with a webhook listener that relays confirmed orders to the OpenAI Conversions API (CAPI) on the back end. Here is how to set it up.
1. Squarespace Commerce Event Mapping Table
| Shopper Funnel Action | Squarespace Trigger Location | OpenAI Ads Event | Delivery Method |
|---|---|---|---|
| Site / Storefront Pageview | Code Injection > Header | page_viewed | Browser Pixel |
| Product Details Page View | Store Product Detail Page | contents_viewed | Browser Pixel |
| Add Product to Cart | Store Cart Drawer | items_added | Browser Pixel |
| Complete Purchase (Front-End) | Code Injection > Order Status Page | order_created | Browser Pixel |
| Order Created (Back-End) | Squarespace Orders Webhook | order_created | Server CAPI Relay |
2. Installing the Base Pixel in Squarespace Header
- In your Squarespace admin, go to Website > Pages > Custom Code (or Settings > Developer Tools > Code Injection depending on your template version).
- Under the Header section, paste the standard OpenAI Ads initialization snippet:
<script>
!function(w,d,e,v,n,t,s){if(w.oaiq)return;n=w.oaiq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!w._oaiq)w._oaiq=n;
n.push=n;n.loaded=!0;n.version='1.0';n.queue=[];t=d.createElement(e);t.async=!0;
t.src=v;s=d.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}
(window,document,'script','https://bzrcdn.openai.com/pixel.js');
oaiq('init', 'YOUR_OPENAI_PIXEL_ID');
oaiq('event', 'page_viewed');
</script>
- Click Save.
3. Order Status Page Client-Side Tracking
To record conversions on the browser, navigate back to Code Injection and locate the Order Status Page box.
Squarespace provides built-in template merge tags (like {orderId} and {orderGrandTotal}) that populate order details when this page renders. Paste this snippet:
<script>
(function() {
var orderId = '{orderId}';
var grandTotal = '{orderGrandTotal}';
var amountCents = Math.round(parseFloat(grandTotal) * 100);
var dedupKey = 'sqsp_order_' + orderId;
if (window.oaiq && orderId) {
window.oaiq('event', 'order_created', {
order_id: String(orderId),
amount: amountCents,
currency: 'USD',
event_id: dedupKey
});
}
})();
</script>
4. Server-Side CAPI Relay via Webhooks
Because client-side tracking will always miss a percentage of sales, setting up a backend webhook is essential. Squarespace allows you to subscribe webhooks to order events via their Developer Platform or low-code automation tools like Zapier and Make.
Webhook Dispatch Format
When an order is created, forward this JSON payload from your webhook endpoint to https://bzr.openai.com/v1/events?pid=YOUR_PIXEL_ID:
{
"validate_only": false,
"events": [
{
"id": "srv_sqsp_12345_1773892800",
"type": "order_created",
"timestamp_ms": 1773892800000,
"action_source": "website",
"event_id": "sqsp_order_12345",
"user_data": {
"em": "5885e35f79901981437bd82f3c73e9f45618f1a4e698ef75c7dd88b8e0bb8f32",
"country": "us"
},
"data": {
"amount": 7900,
"currency": "USD",
"order_id": "12345"
}
}
]
}
Make sure the email address in user_data.em is trimmed, converted to lowercase, and hashed using SHA-256 before sending.
5. Deduplication and Verification
How do we make sure Squarespace doesn't count the sale twice?
The answer is the shared event_id. Both the Order Status Page script and the backend webhook payload send event_id: "sqsp_order_" + orderId.
When OpenAI's servers process both payloads within a 48-hour window, they recognize that both events reference the exact same order. The system merges the browser attribution signal with the verified server-side total and logs a single conversion.
Want an expert team to set up and audit your Squarespace tracking? Check out our Done-For-You Ecommerce Tracking service.
Want this done for you?
Fixed-scope setup, tested end-to-end and documented.
Explore the serviceTake the free audit