Description
WordPress Plugin
Headless WordPress Bridge & Deploy Manager
Universal adapter between WordPress and headless frontends. Fix broken preview buttons, auto JWT authentication, Gutenberg iframe visualizer, deploy triggers, and link monitoring. Works with Next.js, Faust.js, Astro, Nuxt—any headless framework. Stop debugging preview auth on every project.
Preview Redirects
JWT Manager
Deploy Triggers
Framework Agnostic
Stop debugging preview auth on every headless project
Headless WordPress breaks the preview button. Editors click “Preview” and get 404 errors or 403 Forbidden. Setting up JWT authentication manually takes 2-4 hours per project and breaks easily. Faust.js is buggy and React-only. Headless Bridge fixes all of this with five drop-in modules that work with any framework.
Universal Preview
Redirects preview button to frontend with secure tokens. 5-minute expiry. Works with any framework.
JWT Manager
Auto JWT generation. No WPGraphQL setup. HS256 signing. 1-hour tokens with auto-refresh.
Iframe Visualizer
Live preview in Gutenberg sidebar. See frontend styling while editing. No more blind editor.
Deploy Triggers
Auto Vercel/Netlify builds on publish. Dashboard widget. Manual deploy button. Status tracking.
Link Monitor
Auto URL rewriting. Backend to frontend. Removes wp-admin links. SEO-safe output.
The headless preview problem
In monolithic WordPress, preview works perfectly—the theme and content live together. In headless WordPress, the frontend lives on Vercel/Netlify. When editors click “Preview,” they get 404s because the frontend can’t interpret WordPress preview URLs. Setting up JWT auth manually takes hours and breaks easily.
Manual JWT Setup: 2-4 hours per project
Install WPGraphQL JWT Auth. Configure secret. Write frontend validation. Debug 403 errors. Add token refresh logic. Breaks on every update.
Faust.js: Buggy and React-only
GitHub issues show broken template resolution, menu links failing in preview. Locks you into React. Doesn’t work with Astro, Nuxt, or SvelteKit.
Headless Bridge: 5-minute setup, works with everything
Install plugin. Enter frontend URL. Done. Works with Next.js (App Router & Pages), Astro, Nuxt, Faust.js, SvelteKit—any framework. Auto JWT. Auto preview redirects.
🚀 Framework Support Matrix
✓ Next.js (App Router & Pages)
Full support for both routing systems. Preview API routes work out of the box. getStaticProps, getServerSideProps, Server Components—all compatible.
✓ Astro
Astro endpoints handle preview validation. Static site generation with on-demand revalidation. Island architecture fully supported.
✓ Nuxt 3
Server middleware validates tokens. Vue SFC components with preview mode. Hybrid rendering compatible.
✓ Faust.js, SvelteKit, Remix
Framework-agnostic token system works with any JavaScript framework. REST API endpoints provide universal compatibility.
Five modules solve five problems
Each module addresses a specific headless WordPress pain point. Enable the ones you need. All work together seamlessly.
Module 1: Universal Preview Hook
Intercepts preview_post_link filter. Generates secure one-time token (5-min expiry). Redirects to: yourfrontend.com/api/preview?token=abc123. Frontend validates via REST API. Shows draft content.
Module 2: JWT Authentication Manager
Auto-generates JWT tokens with HS256 signing. 64-char random secret. 1-hour validity. REST endpoint: /wp-json/headless-bridge/v1/jwt. No WPGraphQL JWT Auth plugin needed.
Module 3: Gutenberg Iframe Visualizer
Sidebar panel in Gutenberg editor. Loads frontend URL in iframe (600px height). Shows live preview of headless frontend while editing. Eliminates “blind editor” syndrome. Optional (disable for performance).
Module 4: Deploy Triggers
Automatic webhook calls to Vercel/Netlify on content publish. Dashboard widget shows last deploy time/status. Manual “Trigger Deploy Now” button. Supports Vercel, Netlify, custom webhooks.
Module 5: Link Monitor
Automatic URL rewriting in the_content filter. Replaces backend URLs (wordpress.local) with frontend URLs (yoursite.com). Removes wp-admin links entirely. Prevents SEO issues from leaking backend URLs.
REST API Endpoints
Two endpoints: /preview (validates tokens, returns JWT) and /jwt (generates auth tokens). Framework-agnostic. Works with any HTTP client. Complete documentation in settings page.
⏱️ Agency ROI Calculator
Manual JWT setup per project: 2-4 hours debugging preview authentication, token refresh, 403 errors.
Without Headless Bridge:
4 hours × $200/hour × 10 projects/year = $8,000 lost
With Headless Bridge ($199/year):
5 minutes setup × 10 projects = 50 min total
Savings: 39.2 billable hours = $7,840/year
📋 Frontend Integration Example
Next.js API Route (5 lines of code):
export async function GET(request) {
const token = request.nextUrl.searchParams.get('token');
const res = await fetch(wpUrl + '/wp-json/headless-bridge/v1/preview?token=' + token);
const { jwt_token } = await res.json();
return Response.redirect('/posts/' + postId + '?jwt=' + jwt_token);
}
That’s it. Complete documentation included in plugin settings page.
🚀 Deploy Triggers Dashboard
Scenario: Content team publishes new blog post at 2pm.
Without Deploy Triggers: Developer manually triggers Vercel build at 4pm when they notice. Content not live for 2 hours. Missed traffic.
With Deploy Triggers: Automatic webhook fires on publish. Vercel builds in 30 seconds. Content live at 2:01pm. Zero developer intervention.
Dashboard widget shows: “Last deploy: 2:00pm Today – Status: Success”
📱 Gutenberg Visualizer Panel
Problem: Editor makes changes. Can’t see frontend styling until publishing. “Blind editor syndrome.”
Solution: Sidebar panel in Gutenberg shows live iframe of frontend. Editor sees: “Oh, that heading is too large on the actual site.” Adjusts before publishing.
Toggle in settings: Enable for real-time preview. Disable for faster editor performance. Your choice.
Perfect for agencies and headless developers
Agencies building headless WordPress sites for clients. Freelance developers. In-house teams migrating to headless. Anyone using Next.js, Astro, Nuxt, or any headless framework.
Web Agencies
Building 5-20 headless projects/year. Saves 2-4 hours per project on JWT setup. $199/year pays for itself on first project. High retention (use on every build).
Freelance Developers
Building headless sites for clients. Drop-in solution eliminates JWT debugging. 5-minute setup vs 4-hour manual implementation. $99/year basic plan sufficient.
Enterprise Teams
Large publishers migrating to headless. Forbes, TechCrunch-scale. Custom licensing ($500-1000/year). Priority support. Eliminates months of internal debugging.
Frequently asked questions
Does this work with Next.js?
Yes! Works with both App Router and Pages Router. Framework-agnostic token system. Also works with Astro, Nuxt, Faust.js, SvelteKit, Remix—any JavaScript framework.
How does preview redirect work?
Intercepts preview_post_link filter. Generates secure one-time token (5-min expiry). Redirects to your frontend /api/preview route with token. Frontend validates via REST API. Shows draft content.
Do I need WPGraphQL JWT Auth?
No! That’s the point. Headless Bridge auto-generates JWT tokens with built-in HS256 signing. No manual WPGraphQL setup. No debugging 403 errors. Just works.
What’s the Gutenberg visualizer?
Sidebar panel in Gutenberg editor showing iframe of your frontend. Real-time preview while editing. Eliminates “blind editor” syndrome. Optional (can disable for performance).
How do deploy triggers work?
Automatic webhook calls to Vercel/Netlify on content publish. Dashboard widget shows last deploy time/status. Manual “Trigger Deploy Now” button for immediate rebuilds.
What is link monitoring?
Automatic URL rewriting. Replaces backend URLs (wordpress.local) with frontend URLs (yoursite.com). Removes wp-admin links. Prevents SEO issues from leaking backend URLs.
How much frontend code is required?
5 lines of code in your /api/preview route. That’s it. Complete integration example provided in plugin settings. Works with any framework’s routing system.
Is this better than Faust.js?
Framework agnostic (Faust.js is React-only). More reliable (GitHub issues show Faust.js preview bugs). Drop-in plugin (no custom frontend framework). Works with Next.js, Astro, Nuxt, anything.
Technical requirements
WordPress
6.0 or higher
PHP
8.2 or higher
Headless Frontend
Next.js, Astro, Nuxt, etc
Deploy Platform
Vercel, Netlify (optional)
