RevvUp.ai for Headless & Hydrogen storefronts.

API-native. Theme-agnostic. Designed for engineering teams.

Going headless gives you full control over performance, design, and data architecture — and removes the safety net Liquid themes provided for free. Native Shopify themes auto-generate JSON-LD for products and collections, ship default robots.txt with AI crawler access, and propagate structured data through Shopify Catalog automatically. Hydrogen and Next.js storefronts inherit none of that. Every Product schema field, every llms.txt directive, every robots.txt rule, every UCP-ready feed has to be explicitly built. RevvUp.ai integrates with headless Shopify storefronts as a set of API-native primitives — not a Liquid theme app, not a script tag injection — so your team gets the structural data layer AI engines actually read, without rebuilding it internally.

The headless AI visibility tradeoff

A Hydrogen or Next.js storefront in 2026 has structural advantages most Liquid themes can't match:

• Streaming SSR for sub-second LCP on PDPs
• Oxygen edge deployment across 285+ locations globally
• React Router v7 loader patterns for clean Storefront API data flow
• Full control over schema generation, meta tags, and crawler directives
• Custom routing for AI-specific pages (/llms.txt, /llms-full.txt, /.well-known/web-bot-auth)

The flip side is everything that doesn't ship for free:

• Product schema isn't there unless you generate it. Liquid themes emit Schema.org Product, Offer, AggregateRating, and Review markup by default. In Hydrogen you build it from Storefront API responses.
• robots.txt defaults to whatever you configure (or nothing). AI crawlers (GPTBot, ClaudeBot, PerplexityBot, Google-Extended, Bingbot variations, AppleBot-Extended) need explicit allow rules. Default Hydrogen configs often miss them.
• llms.txt has no built-in route. It's a flat file at the apex domain. Hydrogen serves it via a route handler; Next.js via the App Router; some teams via a Cloudflare Worker. None of these are automatic.
• Shopify Catalog data doesn't flow downstream unless your queries pull it. Google Product Category, GTINs, structured ingredient/material/dimension attributes — if your Storefront API queries don't fetch them, they're not in your feed, and not in Copilot's product surface.

Shopify's May 2026 launch of the Agentic Storefronts admin section made one half of this visible — merchants now see per-AI-channel rank visibility directly in the Shopify admin. But that section governs the catalog layer. Your Hydrogen storefront is still the page the AI crawler actually visits and the JSON-LD the crawler actually parses. Both layers need to be in sync.

How RevvUp.ai integrates with Hydrogen

The Hydrogen integration is API-native at three levels:

1. Schema generation SDK

A lightweight TypeScript SDK that consumes Storefront API responses and emits validated Schema.org JSON-LD for Product, Offer, AggregateRating, Review, FAQPage, BreadcrumbList, Organization, and additionalProperty arrays. Drop-in at the route loader level:

```typescript // app/routes/products.$handle.tsx (Hydrogen v2026.4+) import {generateProductSchema} from '@revvup/hydrogen';

export async function loader({params, context}) { const {product} = await context.storefront.query(PRODUCT_QUERY, { variables: {handle: params.handle}, });

const schema = generateProductSchema(product, { includeReviews: true, includeAdditionalProperties: ['ingredients', 'certifications', 'dimensions'], metafieldNamespace: 'revvup', });

return defer({product, schema}); }

// In the route component: <script type="application/ld+json" dangerouslySetInnerHTML={{__html: JSON.stringify(schema)}} /> ```

The SDK validates output against Google's Rich Results Test schema and Schema.org spec before emission, so invalid markup never reaches production. Same SDK is available for Next.js (App Router and Pages Router), Remix, Astro, and SvelteKit — the underlying generation logic is framework-agnostic.

2. Admin API push for metafields and content

The same metafield, llms.txt, and content-push layer that RevvUp's standard Shopify product uses is exposed via API for headless teams. Two integration patterns:

• Read-only mode (most common). RevvUp.ai writes to Shopify metafields via the Admin API; your Hydrogen storefront reads those metafields via the Storefront API as the source of truth. No write conflicts; your headless rendering owns the presentation.

• Direct route push (for teams that prefer it). RevvUp.ai exposes a content-push API that updates structured data, FAQ blocks, and freshness timestamps via webhook delivery to your headless app. Useful for teams running content layers outside Shopify (Sanity, Contentful, Strapi).

3. llms.txt route generation

For Hydrogen, a single route handler:

```typescript // app/routes/llms[.]txt.tsx import {generateLlmsTxt} from '@revvup/hydrogen';

export async function loader({context}) { const llmsTxt = await generateLlmsTxt({ storefront: context.storefront, config: { includeCollections: true, includeTopProductsCount: 20, includeEducationContent: true, }, });

return new Response(llmsTxt, { headers: {'Content-Type': 'text/plain'}, }); } ```

For Next.js App Router: similar pattern via app/llms.txt/route.ts. For teams using a Cloudflare Worker fronting their headless storefront, RevvUp.ai can also generate and serve llms.txt at the edge via a Worker module — useful if you want to avoid touching the storefront codebase.

A companion llms-full.txt route is available for stores with substantive long-form content. Both refresh on a cadence you configure (weekly by default, on-demand via webhook).

The robots.txt and Web Bot Auth picture

Two crawler-related details Hydrogen and headless teams need to handle explicitly:

robots.txt allow rules for AI crawlers

The AI crawler User-Agent strings worth allowing (or explicitly denying) in your Hydrogen robots.txt route:

```

User-agent: GPTBot # OpenAI User-agent: ChatGPT-User # OpenAI user-triggered fetches User-agent: OAI-SearchBot # OpenAI search crawler User-agent: ClaudeBot # Anthropic User-agent: Claude-Web # Anthropic browse mode User-agent: PerplexityBot # Perplexity User-agent: Perplexity-User # Perplexity user-triggered fetches User-agent: Google-Extended # Gemini training (separate from Googlebot) User-agent: GoogleOther # Google AI products User-agent: Applebot-Extended # Apple Intelligence User-agent: Bingbot # Bing / Copilot core User-agent: cohere-ai # Cohere User-agent: anthropic-ai # Alternative Anthropic UA Allow: /

Disallow: /account Disallow: /cart Disallow: /checkout ```

Allowing AI crawler access is the default RevvUp.ai recommendation for commerce stores — your AI visibility depends on these crawlers being able to read your storefront. The exceptions are accounts/cart/checkout (always blocked) and explicit policy reasons to opt out of training-data collection (a separate consideration from search-time retrieval).

Web Bot Auth

In May 2026, Shopify began requiring bots and agents to identify themselves via Web Bot Auth, an IETF draft standard for cryptographically authenticated bot traffic. Cloudflare has shipped Verified Bots integration for the standard. For Hydrogen storefronts behind Cloudflare or running on Oxygen, this is increasingly important:

• Verified bots get priority routing and aren't rate-throttled
• Unverified bots (and impersonators) get progressively throttled
• Your /.well-known/web-bot-auth endpoint declares your verification policy

RevvUp.ai's Hydrogen SDK includes a Web Bot Auth route handler that publishes the appropriate verification policy and integrates with Cloudflare's Verified Bots configuration. This matters more for headless teams than for Liquid teams because Shopify's edge protections don't apply identically to Oxygen-hosted Hydrogen routes.

The Storefront API query patterns that matter

A few non-obvious things your Storefront API queries need to pull explicitly for AI visibility:

``graphql query Product($handle: String!) { product(handle: $handle) { # ... standard fields metafields(identifiers: [ {namespace: "revvup", key: "ingredients"}, {namespace: "revvup", key: "inci"}, {namespace: "revvup", key: "ph"}, {namespace: "revvup", key: "suitability"}, {namespace: "revvup", key: "certifications"}, {namespace: "revvup", key: "free_from"}, {namespace: "revvup", key: "country_of_origin"}, {namespace: "revvup", key: "weight_gsm"}, # ... category-specific metafields ]) { key value type } seo { title description } productType tags variants(first: 100) { nodes { id title sku barcode # GTIN for product feeds availableForSale quantityAvailable weight weightUnit # ... pricing, options } } images(first: 10) { nodes { url altText width height } } } } ``

Two specific notes:

• Image alt text matters for AI extraction — Copilot and ChatGPT both use alt text for product matching on image-based queries. Headless storefronts often skip alt text generation because it's "not visible" — but it's visible to AI.
• Barcode → GTIN is essential for Google Merchant Center feeds (which feed ChatGPT product carousel) and Microsoft Shopping feeds (which feed Copilot). Pull barcode and surface it as the gtin13 / gtin14 field in your Product schema.

The Shopify Agentic Storefronts hook for Hydrogen

The Agentic Storefronts admin section that launched in May 2026 gives Shopify merchants per-AI-channel rank visibility — but the actual page AI crawlers visit is still your Hydrogen route at /products/<handle>. The two layers need to be in sync.

RevvUp.ai handles this by:

1. Writing the same structured product attributes (ingredients, certifications, suitability, sourcing, etc.) into both the metafield layer (which Shopify Catalog reads for the Agentic admin) and the Schema.org layer (which your Hydrogen route emits)
2. Validating consistency — alerting when the catalog layer says one thing and the rendered Hydrogen page says another
3. Generating UCP-ready feeds (Universal Commerce Protocol — Microsoft's open standard for agentic commerce structured data) automatically from the same source of truth

This is the structural reason RevvUp.ai's headless integration is more valuable than a generic AI visibility tool: AI engines are increasingly verifying recommendations against the actual storefront before citing. A clean catalog layer with an inconsistent Hydrogen render now actively hurts you.

How RevvUp.ai handles non-Shopify backends in a headless build

Some headless stacks use Shopify as the backend but consume content from another CMS (Sanity, Contentful, Strapi). RevvUp.ai supports this configuration:

• Shopify-side: Product, Offer, AggregateRating, Review schemas pulled from Storefront API
• CMS-side: Article, FAQPage, BreadcrumbList, BlogPost schemas pulled from your CMS via webhook integrations (we have first-class integrations with Sanity, Contentful, and Strapi)
• llms.txt: Generated from both data sources — products and collections from Shopify, education and content from the CMS

The structured data layer is unified at output time, regardless of where the underlying data lives.

What this looks like in your build

For most headless teams, the RevvUp.ai integration ships in 1–3 working days:

1. Install the SDK (npm install @revvup/hydrogen or @revvup/nextjs)
2. Generate an API key from the RevvUp.ai admin
3. Drop the schema generators into your product / collection / article routes
4. Add the llms.txt and robots.txt route handlers
5. Configure OAuth between RevvUp.ai and your Shopify store for metafield writes

After that, the platform runs on its standard cadence — weekly Measure refresh, monthly Audit, fix queue with structured-data updates pushed via API. Your team writes features; the platform writes structured data.

Talk to an engineer to get the partner-tier SDK access for your Hydrogen or Next.js build.

Questions

Keep going