How I used Claude AI and an MCP plugin to create a WordPress site in 1 hour

How I used Claude AI and an MCP plugin to create a WordPress site in 1 hour

How I used Claude AI and an MCP plugin to create a WordPress site in 1 hour

I’ll be honest — when I started building the landing page for amrselim.com for my book Restart, I wasn’t sure what to expect from using Claude AI with WordPress. But what happened over the next few hours completely changed how I think about web development and AI!

The Challenge: Building a Professional Landing Page

I needed a complete landing page for my book — something professional, mobile-responsive, SEO-optimized, and ready to rank on Google. The kind of project that normally takes many hours or even days.
Instead of following my usual website development workflow, I decided to try something different: working directly with Claude AI through the WPVibe plugin connector for WordPress.

All the website building AI tools that I had used before were either not working well with WordPress, or setup to do their own coding that only works with a certain setting – like block editing in Gutenberg – or they only work with a certain theme like Elementor pro.
I had never tried an AI tool for web design before that gave me the freedom to work with anything that I want to work with including my favorite theme Divi.

What We Built Together

Working conversationally with Claude, we built a complete landing page from scratch with:

  • 7 fully designed sections — Hero, hook, feature cards, author bio, journey timeline, podcast showcase, and final CTA
  • Complete mobile responsiveness — Custom breakpoint-specific typography, spacing, and layouts that work perfectly on phones, tablets, and desktops
  • Full SEO optimization — Meta descriptions, Open Graph tags, Twitter cards, schema markup (Book + Person), and all the technical SEO details
  • Image optimization — Right-sized images for performance, complete ALT text for accessibility
  • Custom interactions — Button styling, hover states, visual hierarchy

The page went live at amrselim.com — fully functional, fast-loading, and ready to convert visitors into readers of my book.

How It Actually Worked

Here’s what surprised me most: I didn’t write a single line of code. I didn’t touch the Divi page builder. I didn’t SSH into my server or wrestle with FTP.

Instead, I had a conversation. A really productive one.

I’d say something like “the hero section needs more breathing room on mobile” and Claude would instantly adjust the responsive padding. I’d mention “the buttons should swap order — Amazon first, then Canada” and it would handle both the visual order and the styling in one go.

When we hit a snag with the Yoast SEO schema still showing my old dev site URL, Claude walked me through adding a PHP snippet via WPCode that fixed it permanently. No confusion. No trial and error. Just clear, specific solutions.

The Technical Stuff (That I Didn’t Have to Think About)

Behind the scenes, Claude was handling things I normally spend hours researching:

  • Divi module configuration — Custom padding values for desktop, tablet, and phone breakpoints
  • Responsive typography — H1 at 56px/42px/32px, H2 sections at 36px/28px/24px, all properly scaled
  • CSS flexbox ordering — Making buttons appear in a different order visually while keeping the DOM structure clean
  • Schema.org markup — Book schema with ISBN, ratings, offers; Person schema with job title, location, social profiles
  • Yoast indexable optimization — Fixing cached URLs in the database after a site migration
  • Image sizing strategy — Using 683px book cover instead of 1500px, YouTube thumbnails at 480px instead of 1280px

All of this happened in real-time through natural conversation. No tutorials. No documentation deep-dives. Just asking for what I wanted and watching it happen.

The Iteration Speed Was Unreal

Here’s where it really clicked for me: when something wasn’t quite right, fixing it took seconds instead of hours.

Normally, requesting a change means explaining it to a developer, waiting for them to implement it, reviewing the result, maybe requesting another tweak. That cycle repeats until it’s right.

With Claude, the feedback loop was instant. I’d see something on the page, mention it conversationally, and the fix would be live moments later. We went through dozens of iterations — mobile layout adjustments, button styling tweaks, spacing refinements — in the time it would normally take to get through one or two rounds of revisions.

Why WP Vibe Makes This Possible

The secret ingredient here is the WP Vibe plugin. It’s what connects Claude directly to your WordPress site — giving it the ability to read your content, update pages, optimize images, configure plugins, and handle all the technical details.

Without WP Vibe, Claude is just a chatbot that can give you advice. With it, Claude becomes a capable development partner that can actually do the work alongside you.

It handles everything through WordPress’s native REST API and WP-CLI — no sketchy access, no security risks. Your site stays secure while getting the benefits of AI-powered development.

What This Means for Non-Technical Founders

I’ve been building websites for years, so I’m comfortable with code. But here’s what struck me: you don’t need to be technical to use this effectively.

The entire interaction is conversational. You describe what you want in plain English. Claude handles the implementation details. You see the result on your site immediately.

This is a game-changer for:

  • Authors and creators who need professional landing pages without hiring developers
  • Small business owners who want to iterate quickly on their website without expensive agency contracts
  • Entrepreneurs testing ideas who need to move fast and can’t wait weeks for development cycles
  • Anyone managing WordPress who’s tired of wrestling with page builders and plugin settings

The Time and Cost Savings

Let me put this in perspective. The landing page we built would have cost me:

  • $2,000-$5,000 if I hired a designer + developer on Upwork or Fiverr
  • 2-3 weeks of back-and-forth revisions and project management
  • Ongoing costs every time I wanted to make a change or update

Instead, we built it in a few focused hours. The quality is professional. The page is live. And I can make changes anytime by just asking.

That’s not just convenient — it’s transformative for how you can operate as a solo founder or small team.

My Honest Recommendation

If you’re running a WordPress site and you’re not using Claude with WP Vibe yet, you’re working way harder than you need to.

This isn’t about replacing developers — it’s about giving yourself the ability to move at the speed of your ideas. To test things quickly. To iterate without friction. To build professional-quality pages without needing to learn Divi, troubleshoot CSS, or decode SEO plugin settings.

I went into this project skeptical. I came out genuinely impressed. This is the future of how people will build and manage websites — and it’s available right now.

Getting Started

If you want to try this yourself:

  1. Install the WP Vibe plugin on your WordPress site
  2. Connect your site to Claude (it takes about 2 minutes)
  3. Start describing what you want to build or change
  4. Watch it happen in real-time

The landing page we built is live at amrselim.com if you want to see the results. Every section, every responsive breakpoint, every SEO detail — all built conversationally with Claude.

This isn’t hype. It’s just a better way to build.

Other Resources