hydrogen-analytics-tracking
Hydrogen Analytics & Tracking — Agent Skill
Build a complete tracking pipeline on Shopify Hydrogen: client dataLayer → GTM → browser pixels, AND server
/api/track→ GA4 MP / Meta CAPI / Google Ads, with sharedevent_idfor cross-side deduplication. Covers consent mode v2, CSPstrict-dynamic, Oxygen full-page cache compatibility, and the surprising gotchas that bite every implementation.
This skill encodes hard-won lessons from production tracking work on Hydrogen storefronts. The reference files contain detailed implementations; this top page is the map.
When to use this skill
You need this if you're:
- Implementing GA4 / Meta / Google Ads / TikTok tracking on Hydrogen and the default Hydrogen Analytics components aren't enough.
- Adding server-side tracking (Measurement Protocol, Conversions API) for resilience against ad-blockers and ITP.
- Debugging "event X is in GTM Preview but not in GA4 / Meta".
- Wiring up conversion deduplication between browser pixel and server CAPI.
- Setting up tracking on a Hydrogen storefront with Weaverse as the CMS layer.
- Investigating why Oxygen full-page cache is being disabled despite a correct
Oxygen-Cache-Controlheader.
More from weaverse/shopify-hydrogen-skills
shopify-hydrogen
Core Shopify Hydrogen APIs — createHydrogenContext, cart handler, CartForm, caching strategies, pagination, SEO, variant selection, analytics, and CSP.
20hydrogen-cookbooks
Step-by-step implementation guides for building features in a Shopify Hydrogen storefront — bundles, combined listings, customer accounts, 3D models, performance, variant media, and Weaverse integration.
20hydrogen-upgrades
Step-by-step guides for upgrading Shopify Hydrogen between versions — breaking changes, code diffs, and migration steps for each release.
19theme-update
Safely update a Weaverse Pilot theme to the latest version — detects current version, fetches release diffs, plans changes category-by-category, preserves customizations, verifies build.
16weaverse-hydrogen
Build Shopify Hydrogen storefronts with Weaverse — components, schemas, loaders, theming, data fetching, React Router v7, deployment, and advanced features.
15weaverse-integration
Integrate Weaverse into an existing Shopify Hydrogen project — analyze codebase, convert existing components to Weaverse sections, set up SDK, configure routes, and preserve coding style. For projects not yet using Weaverse.
13