Shopify App
The Coframe app for Shopify: install from the App Store, connect the store, and Coframe serves the SDK, tracks checkouts and attributes orders without any theme code
Copy this guide and your current settings as a prompt for your AI agent.
Preview agent promptSee the guide, code and settings included when you copy.
The Coframe app for Shopify wires a storefront for experiments and attribution in one ten-minute setup, with no theme code changes. You install it from the Shopify App Store, connect it to your Coframe project with two values, and switch it on. Until you switch it on, nothing reaches shoppers.
On this page
01What the app does
| Piece | What it is | Where it runs |
|---|---|---|
| App embed | A theme app embed that serves the Coframe SDK (cf.js) and the Shopify helper script on every storefront page, with anti-flicker |
The shopper’s browser, through Shopify’s theme app embed |
| Web pixel | A Shopify web pixel that reports checkout_started and checkout_completed to Coframe |
Shopify’s pixel sandbox, including on Shopify-hosted checkout and Shop Pay |
| Order webhooks | checkouts/create, checkouts/update and orders/create, forwarded to the Coframe Conversion API with your conversion API key |
The Coframe app server, consent-independent |
| Dashboard | Connect the store, see connection health, set anti-flicker, disconnect | The Shopify admin |
The two tracking paths exist because each covers a case the other cannot. The webhook needs the visitor token in the order’s attributes, which a dynamic checkout button (Buy it Now, Shop Pay) bypasses. The pixel reads the token from the checkout itself and works on any checkout origin. Both carry the same deduplication key per order, so one purchase is counted once. See Tracking and consent.
02What the app does not do
- It does not edit your theme. The scripts arrive through an app embed you switch on in the theme editor, and switch off the same way.
- It does not store shopper data. The only state it keeps is the store’s connection settings.
- It does not proxy pixel events. The pixel posts straight to Coframe.
03Pages in this section
| Page | Use it when |
|---|---|
| Setup | Installing the app, including migrating from a manual install |
| Settings and permissions | Adjusting anti-flicker; explaining the access the app asks for |
| Verify and troubleshoot | Proving the install works, and the five things that usually go wrong |
| Tracking and consent | How checkouts are captured and attributed, and what a shopper’s consent choice changes |
04Credentials you need
| Value | Shape |
|---|---|
| Project ID | 24 hexadecimal characters, no dashes |
| Conversion API key | Starts with cfpv1_. A secret: paste it into the app only |
Both are issued by Coframe and sent to the store directly. The app cannot be connected without them.
# Shopify App The Coframe app for Shopify: install from the App Store, connect the store, and Coframe serves the SDK, tracks checkouts and attributes orders without any theme code The Coframe app for Shopify wires a storefront for experiments and attribution in one ten-minute setup, with no theme code changes. You install it from the Shopify App Store, connect it to your Coframe project with two values, and switch it on. Until you switch it on, nothing reaches shoppers. [Video: Video: what the setup is, what to have ready, and the six steps in order (74s, narrated)](assets/videos/shopify-app-overview.mp4) Watch: 74s — what the setup is, what to have ready, and the six steps in order Two ways to install Coframe on Shopify The app is the recommended way. The older method, pasting the install script into `theme.liquid` and adding a custom pixel by hand, is kept on [SDK Integrations → Shopify](../docs/shopify.html) for stores that cannot use the app. Never run both: see [Migrating from the manual install](../docs/setup.html#migrating-from-the-manual-install). ## What the app does Piece | What it is | Where it runs | App embed | A theme app embed that serves the Coframe SDK (`cf.js`) and the Shopify helper script on every storefront page, with anti-flicker | The shopper’s browser, through Shopify’s theme app embed | Web pixel | A Shopify web pixel that reports `checkout_started` and `checkout_completed` to Coframe | Shopify’s pixel sandbox, including on Shopify-hosted checkout and Shop Pay | Order webhooks | `checkouts/create`, `checkouts/update` and `orders/create`, forwarded to the Coframe Conversion API with your conversion API key | The Coframe app server, consent-independent | Dashboard | Connect the store, see connection health, set anti-flicker, disconnect | The Shopify admin | The two tracking paths exist because each covers a case the other cannot. The webhook needs the visitor token in the order’s attributes, which a dynamic checkout button (Buy it Now, Shop Pay) bypasses. The pixel reads the token from the checkout itself and works on any checkout origin. Both carry the same deduplication key per order, so one purchase is counted once. See [Tracking and consent](../docs/tracking-and-consent.html). ## What the app does not do - It does not edit your theme. The scripts arrive through an app embed you switch on in the theme editor, and switch off the same way. - It does not store shopper data. The only state it keeps is the store’s connection settings. - It does not proxy pixel events. The pixel posts straight to Coframe. ## Pages in this section Page | Use it when | [Setup](../docs/setup.html) | Installing the app, including migrating from a manual install | [Settings and permissions](../docs/settings-and-permissions.html) | Adjusting anti-flicker; explaining the access the app asks for | [Verify and troubleshoot](../docs/verify-and-troubleshoot.html) | Proving the install works, and the five things that usually go wrong | [Tracking and consent](../docs/tracking-and-consent.html) | How checkouts are captured and attributed, and what a shopper’s consent choice changes | ## Credentials you need Value | Shape | Project ID | 24 hexadecimal characters, no dashes | Conversion API key | Starts with `cfpv1_`. A secret: paste it into the app only | Both are issued by Coframe and sent to the store directly. The app cannot be connected without them.
BACK TOShopify App