Skip to main content

WP Next Editor

WP Next Editor is a visual, drag-and-drop website builder for building public-facing WordPress sites directly connected to your WordPress database. Templates and pages are stored as structured Lexical JSON in the WP database — making them version-controllable, programmatically manipulable, and AI-ready.


Key Capabilities

  • Drag-and-drop canvas — build pages visually with a live preview. Select, resize, nest, and animate elements directly on the canvas.
  • Responsive design — set per-device breakpoints (desktop, tablet, mobile) and CSS states (hover, focus, etc.). Each device gets its own @media query at render time.
  • Styles (CSS) — define custom CSS variables and apply custom fonts without any external stylesheet.
  • Dynamic data binding — pull posts, users, taxonomies, and options directly from the WordPress database into any element. No custom API endpoints required.
  • Animations — attach CSS keyframe animations to any element.
  • CSS variables — define design tokens at the template level and reference them across all elements for consistent theming.
  • Widget system — embed sub-templates (widgets) inside other templates for reusable headers, footers, and components. Widget variants let the same widget template render different content per embedding.
  • Error and home pages — assign reserved slugs to handle 404, unknown errors, and the site home page without manual routing configuration.
  • JSON editor — edit the raw Lexical JSON directly in a built-in code editor for precise control over template structure.

AI-Powered Template Authoring

All templates are stored as Lexical JSON. AI agents can read, write, and transform them directly — no special export step required.

The wp-next-editor-template agent skill integrates with Claude Code and supports four modes:

ModeWhat it does
createScaffold a new template from a natural-language description
updateModify an existing template based on a prompt
convertConvert HTML/CSS into a Lexical JSON template
helpDescribe available nodes, styles, and patterns

Complex templates that would take hours to build manually can be scaffolded in seconds. The skill is aware of the full node schema and CSS system, so it produces structurally valid output.

See Using AI for installation and usage.


  • Installation — initialize a new Editor project with the CLI
  • Getting Started — create your first template and publish it as a public page
  • Canvas — overview of the editor interface: main area, left nav, right nav, and toolbars