Storyblok x enhancely: AI ready in 5 minutes
Storyblok is a headless content management system with an API-first architecture. Founded in 2017, it operates as a cloud-native SaaS platform hosted on AWS, with server locations available in Europe, the US, Canada, and Australia. The platform is ISO 27001 certified and follows the principle of decoupling content management from content presentation.
What distinguishes Storyblok within the headless CMS category is its visual editor. Content teams can see changes in real-time directly on the frontend, with drag-and-drop functionality for arranging components and modules. This live preview capability addresses a common challenge in headless architectures, where editors often work without visual context of how content will appear once published.
The system is built around a component-based structure. Developers define reusable content blocks that can be assembled and reused across pages and channels. Content is delivered via REST API or GraphQL to any frontend technology – whether that's Next.js, Nuxt, React, Vue, or other frameworks. This allows development teams to work with their preferred tools while content teams use the visual interface independently.
Storyblok includes a built-in Digital Asset Manager for organizing media files, supports multi-language content management, and offers customizable workflows with role-based permissions. The platform provides webhooks to trigger automated rebuilds or other actions when content is published.
The enhancely integration connects to Storyblok-powered websites and automates the generation of structured data. It creates page-specific JSON-LD markup that helps search engines and AI systems interpret your content accurately. The integration is cache-aware for production performance and uses Storyblok webhooks to refresh schema data automatically whenever content is published or updated – without requiring manual markup or additional development effort.
enhancely automatically injects the right JSON-LD (schema.org) for each Storyblok page—no manual markup, no brittle scripts. enhancely and storyblok is a perfect match. Read more about this in our blog about how enhancely fits in a composable architecture.
How It Works
- Your app sends the current page URL to the Enhancely API
- enhancely returns ready-made JSON-LD for that URL
- The plugin injects it as <script type="application/ld+json"> in SSR HTML
- Built-in caching prevents repeated fetches
- Revalidation is throttled (revalidateInterval, default 5 minutes) to avoid calling the API on every request
- A Storyblok webhook can invalidate the cache on publish
Installation
This package is distributed via GitHub release tarballs.
npm install https://github.com/enhancely/headless-cms-plugin/releases/download/v1.0.6/enhancely-headless-cms-plugin-1.0.6.tgz
Quick setup (Next.js App Router)
- Copy the Storyblok recipe bundle from: recipes/storyblok/next-app-router/template/
- Set env vars:
- ENHANCELY_API_KEY (server-only)
- NEXT_PUBLIC_SITE_URL (public origin, e.g. https://example.com)
- STORYBLOK_WEBHOOK_SECRET (server-only)
That's it. Seriously.
Caching Included
- ETag-aware caching (reduces API calls; keeps schema fresh)
- Cache backends: Memory, File, or Redis
- For multi-instance/serverless production, prefer Redis (shared cache)
Storyblok Webhook for Real-Time Updates
- Create a webhook pointing to: /api/webhooks/storyblok
- Protect it with a secret (prefer headers over query params):
- x-webhook-secret: <secret> or Authorization: Bearer <secret>
- Behavior:
- If payload contains full_slug, clears that page (e.g. /pricing)
- If not, can clear all as a safe default
Compatibility & Requirements
- Node.js >= 18
- Next.js: >= 13 (App Router recommended)
- Nuxt: >= 3
- CMS: Storyblok (webhook supported)
Learn More
Full documentation with all configuration options at docs.enhancely.ai.