Description
HeadlessNext Connector seamlessly links your WordPress CMS with modern decoupled frontends like Next.js, Vercel, Nuxt, SvelteKit, or Remix.
When editors publish, update, or delete posts and pages in WordPress, HeadlessNext Connector sends a fast, asynchronous, non-blocking webhook (POST request) to your frontend API route. This triggers Incremental Static Regeneration (ISR), updating your static site’s cache instantly without rebuilding the entire website!
Key Features:
- On-Demand ISR Revalidation: Trigger instant cache invalidation on Next.js (
revalidatePath()orrevalidateTag()) when posts or pages change in WordPress. - Asynchronous & Non-Blocking: Fires requests in the background so WordPress post publishing is never delayed waiting for external server responses.
- Shared Secret Security: Send an
X-HeadlessNext-SecretHTTP header to verify that revalidation requests originate exclusively from your authorized WordPress site. - Universal Compatibility: Works with any active WordPress theme, Gutenberg block editor, Classic Editor, and custom REST API / GraphQL setups.
- Zero Overhead: Completely inert when no Frontend URL is configured. Zero external tracking or phone-home requests.
Screenshots
Installation
- Upload the
headlessnext-connectordirectory to/wp-content/plugins/or install directly via Plugins Add New in your WordPress dashboard. - Activate HeadlessNext Connector.
- Go to Settings HeadlessNext Connector.
- Enter your Frontend Base URL (e.g.
https://my-site.com) and Revalidation Path (e.g./api/revalidate). - (Optional) Set a shared secret token for request verification.
- Check “Automatically ping the frontend on post publish or update” and save changes.
Quick Next.js App Router Integration Example
Create app/api/revalidate/route.ts in your Next.js project:
import { revalidatePath } from 'next/cache';
import { NextResponse } from 'next/server';
export async function POST(request: Request) {
const secret = request.headers.get('x-headlessnext-secret');
if (secret !== process.env.REVALIDATE_SECRET) {
return NextResponse.json({ message: 'Invalid secret' }, { status: 401 });
}
const body = await request.json();
const slug = body.slug || '/';
// Revalidate the updated page path
revalidatePath(/${slug}`);
revalidatePath(‘/’); // Revalidate homepage list
return NextResponse.json({ revalidated: true, now: Date.now() }); } `
FAQ
-
Does this plugin require a specific WordPress theme?
-
No! HeadlessNext Connector works standalone with any theme, including Twenty Twenty-Four or custom block/classic themes.
-
How does On-Demand ISR work with Next.js?
-
Next.js uses Incremental Static Regeneration (ISR) to serve fast static pages. When content changes in WordPress, HeadlessNext Connector sends a webhook payload containing the post ID, slug, and post type to your Next.js API route. Next.js then runs
revalidatePath()to update that static page in the background. -
What data is sent in the Webhook payload?
-
The POST JSON payload includes:
*post_id: The ID of the post/page
*post_type: ‘post’, ‘page’, etc.
*slug: The URI slug of the post
*permalink: Full permalink URL
*action: ‘publish’, ‘update’, or ‘delete’
*home_url: The WordPress site home URL -
How do I secure my revalidation endpoint?
-
Configure a Revalidation Secret in the settings page. HeadlessNext Connector sends this secret in the
X-HeadlessNext-Secretrequest header. Check this header in your Next.js API route before callingrevalidatePath(). -
Is there any performance impact on WordPress?
-
None. All webhook pings use non-blocking HTTP requests (
wp_remote_postwithblocking => false), ensuring the WordPress admin publishing flow remains fast and responsive.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“HeadlessNext Connector” is open source software. The following people have contributed to this plugin.
Contributors
Translate “HeadlessNext Connector” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.0.0
- Initial public release: settings page, non-blocking on-demand ISR revalidation webhook, secret header validation.