How do you actually set up Facebook conversion tracking for Shopify Hydrogen?

[DennisKraaijeveld]

Has anyone found a reliable way to get Facebook (Meta) conversions tracking working properly with a Shopify Hydrogen storefront?

Even after 3–4 years, it feels like there is no progress on this side of things. Hydrogen runs headless, so once the user jumps from your Hydrogen domain (like mysite.com) to Shopify’s checkout (checkout.mysite.com), the Facebook Pixel loses attribution. Has anyone found a solution for this or did I miss something within the Shopify docs?

[DennisKraaijeveld]

Lost clients over this. It's absolutely crazy they release something like Hydrogen and could not even implement a proper way to have conversions tracked. And that for a e-commerce platform...

[paul-phan]

We’ve run into this on production Hydrogen builds too. The short version: don’t treat Meta Pixel alone as the source of truth for purchases on headless Shopify.

For Hydrogen, I’d split the tracking into three layers:

1. Hydrogen storefront events
   Track page_view, view_item, add_to_cart, view_cart, begin_checkout, search, lead/signup, etc. from the Hydrogen app via dataLayer / GTM / Meta Pixel. For important events like add_to_cart and begin_checkout, fire directly from the button click with sendBeacon, not only from Hydrogen’s delayed cart analytics events.

2. Server-side event forwarding
   Send the same storefront events to your own /api/track endpoint and forward to Meta CAPI / GA4 Measurement Protocol / Google Ads. Use the same event_id on browser + server so Meta can deduplicate.

3. Purchase from Shopify webhooks
   For Purchase, the canonical source should be Shopify orders/create webhook, not the browser pixel. Use a deterministic event id like:

   purchase_${shopify_order_id}

   That makes webhook retries idempotent and lets a checkout-side Custom Pixel dedup against the server event if you also fire browser-side Purchase from Shopify Customer Events.

One important gotcha: the order webhook does not include the visitor’s browser cookies. So if you want good Meta match quality, you need to stash identifiers like _fbp, _fbc, _ga, gclid, affiliate refs, etc. into cart attributes / note attributes during the cart mutation, then read them back from order.note_attributes in the webhook.

Also watch out for “Buy now” flows. In many Hydrogen builds, /cart/<variantId>:<qty>?checkout creates the cart in a loader and redirects straight to checkout, bypassing the normal POST /cart action. If attribution stashing only happens in the POST action, Buy-now purchases will arrive with empty note attributes.

So yes: Pixel is fine for storefront funnel + retargeting, but for reliable purchase attribution in Hydrogen, use webhook-based CAPI with dedup + attribution stashing.

We documented the full pattern here if useful:
https://github.com/Weaverse/shopify-hydrogen-skills/tree/main/skills/hydrogen-analytics-tracking