I Rebuilt My WordPress Site with AI in Under an Hour

I took a static mockup and rebuilt it as a real WordPress site with WPVibe — header, footer, front page, a blog, custom post types, a mega menu, even featured images with a little personality — in about an hour. Here’s how it went, and the choices that make AI build well in WordPress.

This one is for the people building real websites — for clients or for themselves — who’ve tried pointing AI at Elementor or full-site editing and watched the results fall apart. If you just want to vibe-code a quick site, I’ll cover that separately. This is the more technical deep dive into the workflow I’ve landed on after a year of testing.

Why classic themes, not full-site editing

Here’s the opinion underneath everything that follows: the best way to build with AI today is classic, file-based themes — hybrid themes that still support blocks — styled with Tailwind.

Full-site editing and page builders are abstract by design. There are layers everywhere — custom CSS on the page, classes the user can override, templates the user can override — and every one of those layers is a place for AI to drift and get lost. Classic themes keep the markup and the styles co-located, so the AI can actually reason about what it’s looking at. Tailwind reinforces that: everything lives in one place instead of being scattered across a stylesheet the model can’t see.

The fair question is: what about non-technical people who need to edit the site? That’s the real benefit FSE is supposed to deliver. My answer is that building and editing are two different stages. You decide where that line sits — and then you make the right surfaces editable on purpose, which I’ll get to below.

Cloning the mockup: header, footer, front page

I started from a static site I’d vibe-coded — just a couple of finished pages and placeholders for the rest — and handed it to WPVibe to seed the design tokens. WPVibe is an MCP agent for WordPress: anything you can do in WordPress, it can do, and then some. It connects to your site, works inside a draft preview sandbox (logged-out visitors keep seeing the live site the whole time), and checks its own work in the browser as it goes.

That browser feedback loop matters more than anything else. The AI builds the header and footer, refreshes the page, compares it to the mockup, and corrects itself. About ten minutes in, the front page was cloned pixel-for-pixel against my static design — fully responsive, mobile included, because the MCP has explicit instructions to handle mobile. Then it created the rest of the pages and wired up the permalinks.

Making the right fields editable

This is how I square “build with AI” against “a human needs to edit this later.” WPVibe ships AI Custom Fields. I asked it to make the headline editable, and it inspected the current markup, called the plugin to wire up a field, and turned it into an editable surface — right there in wp-admin.

You can do this to any field: text, images, the whole range of field types. The win is that the end user gets a small, safe set of things to edit, instead of being dropped into full-site editing wondering which setting is about to break the layout.

A blog and custom post types — in minutes

Next I just said “add a blog,” and the smart part is what happened underneath. It looked at the pattern I’d already established on the home and features pages, reused it, created a blog page, set up the static-front-page / posts-page routing, styled everything, and dropped in test posts. Live, checked, done. The traditional way, that’s days of work. Here it was minutes.

Then a custom post type. I wanted a Cookbook — proven patterns you can run with WPVibe, like an SEO audit playbook or WooCommerce recipes. I didn’t hand it a spec; I described the idea and went back and forth until the shape was right, then let it build the CPT with all the fields. That’s the real shift: it’s so cheap to get close and then tweak that you stop over-planning and start iterating.

The mega menu nobody wants to build by hand

A mega menu in Elementor is usually a full day of work and often a paid add-on. Here I described what I wanted, reviewed the plan, and let it build. I’ll keep iterating on the design — but the version-one structure was there in a few minutes, no plugin required.

Featured images with a little personality

For the blog, I had it generate featured images using a Gemini image skill, the WPVibe logo, and Wapuu — giving Wapuu a comic-strip voice reacting to each article. I pointed it at the licensing (GPL, with attribution), and it researched the right usage, built the images, and added the credit line. To finish, I asked for some subtle “eye candy” — it animated the stat counters and faded sections in on scroll, then surfaced the latest three posts on the home page.

From days to minutes

Start to finish — cloned front page, editable fields, a blog, a custom post type, a mega menu, generated imagery, and animation — in about an hour. The tooling that made it work isn’t magic; it’s a few deliberate choices: classic themes the AI can reason about, Tailwind for co-located styles, a draft sandbox so nothing touches production, a browser feedback loop so the AI checks its own work, and editable fields so humans stay in control of the right surfaces.

If you want to try this on your own site, WPVibe is free to start.