- Vibe coding WordPress means describing a page to an AI agent and letting the agent build it. It works well when the agent edits structured blocks, not free-form code.
- The risk is not the first draft. The risk is an unreviewed change on a live site, a conflict between plugins, or a form that stops sending messages.
- Work on a staging copy, ask for small changes, check each result, and keep a way to roll back. The steps below show how.
01Vibe coding WordPress: decide what the AI may change
Write the goal before you open the AI tool. A goal names one page, one section or one fix, the audience, and the action you want the visitor to take. Vague goals produce large changes that are hard to review.
- Name the page or template to change.
- Name what must stay the same: menus, forms, legal pages and tracking.
- Name the result you will check, such as a button link or a visible heading.
02Work on a staging copy before the live site
Run the AI on a copy of the site, not on the live site. Most hosts offer a staging environment. Take a full backup of the files and the database before the first change, and keep it until the change is live and checked.
- Create a staging copy of the site.
- Take a full backup of the files and the database.
- Restore the backup on a test copy once, so you know it works.
03Write prompts that limit the change
A good prompt names the goal, the limits and the output. Ask for one change at a time, and ask the agent to explain the change before it writes anything. Here is an example:
Build a landing page with a hero, three features and a contact form.
Use only native blocks. Do not add PHP, JavaScript or CSS files.
Keep the existing header and footer. List the changes before you write them.04Check every change before it goes live
Read the result before you publish it. Check the page on a phone-sized screen, the forms, the links and the keyboard. Ask the AI to list everything it changed, and compare that list with what you see.
- Open the page at phone width and at desktop width.
- Submit each form once on staging, and check the message it sends.
- Press Tab through the page. Every link and button must receive focus in a visible order.
- Run a Lighthouse accessibility report from Chrome DevTools.
05Keep code out of theme and plugin files
Edits to a theme file are overwritten when the theme updates. Code that adds scripts to every page slows every visit. Keep the AI work in content, design settings and blocks, where the platform can check each change.
06Review the code the AI writes
Read any code before you accept it. Look for data saved to the database without checks, output printed without escaping, and forms without a nonce. If a line is unclear, ask the AI to explain it before you keep it.
07Vibe coding WordPress with Nucleo
Nucleo describes pages as JSON documents made of blocks. The compiler turns them into HTML and CSS when you save, so the frontend gets finished files and never contacts external servers.
An AI agent connects to Nucleo through its MCP server, with OAuth 2.1. You approve the connection on a consent screen, and you can see and revoke the connected agents in the Connected agents panel.
Each write accepts a dry run. The dry run returns the diff and the quality report without saving. The quality engine checks SEO and accessibility, and a blocking problem stops publication.
- The agent builds with blocks. The raw HTML block needs the unfiltered_html capability.
- Revisions record the author, human or AI, and rollback restores an earlier version.
- Rule R4.6 for agents: no mu-plugins, theme code or scripts in wp_head. Site PHP goes in components.
- The command wp nucleo export writes the site to a folder that you can keep in git.