How to Build a Full Elementor Website with Claude or ChatGPT

Quick answer: how do you build an Elementor website with AI?

Install free Elementor and the Hello Elementor theme, connect Claude or ChatGPT to your site with GoBuildWP, and send one prompt that names the business, the pages, the look and the checks you want. The AI plans the site, builds each page from native Elementor containers and widgets, asks before it changes the live site, then publishes and checks every page at desktop and mobile size.

What you need

Before you start, make sure you have these ready:

• A WordPress site you manage. If your site already has visitors, try this on a staging copy first. Many hosts give you one with a single click.
• Elementor, the free plugin from the WordPress plugin directory.
• The Hello Elementor theme, also free.
• The GoBuildWP plugin, connected to Claude or ChatGPT. The one-prompt website build in this guide uses GoBuildWP Pro's website tools. GoBuildWP Free can build and edit Elementor pages too, one page at a time. See Free vs Pro for the full list.
• A Claude or ChatGPT plan that supports custom connectors.

You don't need Elementor Pro, and you don't need to write any code.

How it works, in plain words

Claude and ChatGPT can't reach your WordPress site on their own. GoBuildWP is the bridge. It's a WordPress plugin that gives your AI a set of safe tools, such as "build an Elementor page" or "edit this widget". When you ask for something, the AI picks the right tool, and GoBuildWP runs it on your site.

The connection works through MCP (Model Context Protocol), an open standard many AI apps now support. For Elementor sites, GoBuildWP works as an Elementor MCP server: it knows Elementor's containers, widgets and style settings, so the AI edits them properly instead of pasting raw HTML. You don't need to know how MCP works. You connect once, and then you just chat.

Three things keep you in control:

1. Approvals. Steps that change your live site ask for your OK first.
2. A change log. Every change is saved with a change ID.
3. Undo. You can undo any change from that log, or ask the AI to undo it for you.

Step 0: Connect your AI to WordPress

You can connect in two ways:

• GoBuildWP Cloud: connect once and manage one site or many from one place. This is the easy choice if you look after several sites.
• Direct MCP connection: connect Claude or ChatGPT straight to one site.

Both are shown step by step in our setup video: Connect Claude or ChatGPT to WordPress with MCP. If you haven't installed GoBuildWP yet, start here.

Once you're connected, open a chat and ask a simple question like "Which plugins are active on my site?" If you get a real answer, the connection works. From here on, this guide assumes you're connected.

Step 1: Install Elementor and the Hello Elementor theme

If you already have Elementor and Hello Elementor, skip to Step 2.

In your WordPress dashboard, go to Plugins → Add New.

Search for Elementor, then click Install Now.

When it finishes, click Activate.

Elementor's setup screen then offers the Hello Elementor theme. Install and activate it.

Why Hello? It's a blank theme. It adds almost no design of its own, so Elementor controls everything, including the header and footer. That gives the AI a clean page to work on and stops your old theme's styles from fighting with the new design.

Last, open the Plugins page and check that both Elementor and GoBuildWP are active.

Step 2: Write one prompt that describes the whole site

Open a new chat in Claude (or ChatGPT) and make sure the GoBuildWP connector is turned on.

Now write your prompt. This is the most important step. The AI builds what you describe, so a clear prompt gives a good first result, and a vague prompt gives a generic one.

Our prompt covered five things:

• The business. FlowPilot, a fictional software company, and who it's for.
• The pages. Home, Features, Solutions, Pricing and About, with the sections we wanted on each one.
• The look. Light colours, a hero led by a big image, a clean modern sans-serif font, and never a wide or stretched display font.
• The method. Every page built 100% in Elementor, using native widgets.
• The checks. Review every page at desktop and mobile size, fix any problems, then publish.

A prompt template you can copy

Here's a template based on ours. Replace the parts in brackets with your own details:

Use the GoBuildWP connector on [your site address]. Build a complete website in Elementor for [business name], a [type of business] for [who the customers are]. >
Pages: Home, [page 2], [page 3], [page 4] and Contact.
- Home: a hero with a headline, short subtext, a main button and a large image; then [sections you want, for example "three key benefits", "customer logos", "a short FAQ"].
- [Page 2]: [sections].
- [Page 3]: [sections]. >
Design: light background, [brand colour] as the accent colour, a clean modern sans-serif font, generous spacing. No dark theme and no wide or extended display fonts. >
Build every page with native Elementor containers and widgets, with no custom code. Set up the header and footer, add all pages to the main menu, and make Home the front page. Check each page at desktop and mobile size, fix what you find, then publish and send me a summary.

Tips for a better first build

• Be specific about sections. "Three pricing cards with a monthly and annual switch" works far better than "a pricing page".
• Say what you don't want. "No dark theme", "no stock photos of handshakes" and "no extended fonts" all help.
• Give real details if you have them. Your actual prices, services and phone number save you an editing round later.
• Keep it to one prompt. You can always ask for changes afterwards in the same chat.

Step 3: Claude builds every page in Elementor

Send the prompt and watch. Claude doesn't jump straight in. It plans the site first: it checks every page it intends to build, then builds them in order. That means the site title, the global colours and fonts, the header and footer, and then each of the five pages.

The Progress panel in Claude shows which step it's on.

A few things worth knowing while it works:

• Pages are built as drafts first. Nothing goes live until the build is done and published.
• Steps that change the live site ask for your approval. Read each one and click to allow it. Nothing changes without your OK.
• It takes a while. A full five-page build is a lot of work. Ours took about half an hour. You don't need to watch every second.
• You can stop it. If you change your mind, ask Claude to cancel the build. The pages already built stay as drafts, and nothing is published.

Step 4: Publish and review the live site

When the pages are built, Claude publishes them, sets Home as the front page and adds all five pages to the main menu.

Then it reviews its own work. It opens the live site at desktop and mobile sizes and checks links, headings and layout. If it finds a problem, like text that overflows on a phone or a broken link, it fixes it. At the end you get a summary of what it built and what it checked.

Read the summary, then check the site yourself. Here's a quick list:

• Click every menu link and every button.
• Read the headlines out loud. Do they sound like your business?
• Open the site on your phone, not only a resized browser window.
• Look at the footer: are the links and the copyright line right?
• Check the page titles in your browser tab.

Write down anything you want changed. You'll use that list in the next step.

Step 5: Ask for refinements in the same chat

If something isn't right, say so in the same chat. Claude still remembers the whole build, so short requests work fine.

We asked for two refinements:

1. Fix the highlight on the monthly and annual switch on the Pricing page.
2. Add subtle fade-up animations to the sections, using Elementor's own motion effects, with no custom code.

Claude made both changes and checked them on the live pages.

Here are more examples of refinement prompts you can try:

• "Make the hero headline on Home shorter and bolder."
• "Swap the order of the Features and Testimonials sections on Home."
• "The buttons feel too small on mobile. Make them full width on phones."
• "Use our brand blue, #2459E0, as the accent colour everywhere."
• "Rewrite the About page in a warmer, more personal tone."

Tip: ask for one or two changes at a time. Each change is easier to check, and if you don't like one, you can undo it on its own.

The result: a five-page website

Here's what we ended up with: a clean, light software website across five pages. Sections fade in as you scroll, and the Pricing page switches between monthly and annual plans.

It works on phones too. Sections stack neatly and the header stays in reach.

Every page is real, editable Elementor

This is the part that matters most. Some AI site builders give you a nice-looking page you can't really edit. Here, every page is a normal Elementor page.

Open any page with Edit with Elementor. The Structure panel shows ordinary Elementor containers, headings, text editors and buttons. Click any element and change it in the panel, exactly as you would on a page you built by hand.

Across the five pages, our site has 841 Elementor elements. There was one exception: the contact form on the About page. Elementor's own Form widget needs Elementor Pro, which we didn't use, so Claude built the form with an HTML widget. If you have Elementor Pro or a form plugin like WPForms, ask Claude to use that instead.

Step 6: Edit the site later, just by asking

The site is live. A week later you want to change the headline. You don't need to open the editor. Open a new chat and ask.

We asked Claude to make three changes:

1. change the Home hero headline to "Automate the busywork. Keep the brilliant work."
2. rename the main hero button
3. update the announcement bar text

A couple of minutes later, Claude reported all three changes as live.

Every change gets a change ID in the GoBuildWP change log. If you don't like an edit, undo it from there, or ask Claude to undo it.

For bigger edits, like restyling a card or adding a whole new section, see our follow-up guide: How to edit an Elementor page with AI.

Make the site your own

FlowPilot is a demo. When you build your real site, you'll want to swap in your own content. You can do all of this by chat:

• Your logo. Upload it to the Media Library, then ask: "Use the logo called [file name] in the header and footer."
• Your photos. Upload them, then ask Claude to replace the images on a page with them.
• Your text. Paste in your real services, prices or team bios and ask Claude to put them on the right page.
• Your colours and fonts. Give the exact colour codes and font names, and ask for them to be used across the site.
• Your contact details. Ask for your phone number, email and address in the footer and on the Contact page.

Troubleshooting

The AI says it can't find any WordPress tools

The connector is probably off for that chat. Check that GoBuildWP is turned on in the chat's connector menu, then try again.

The build stopped halfway

Long builds can pause. Just say "continue the build". The build picks up from the first page that isn't built yet, and nothing already done is lost.

A page looks unstyled or broken after a change

Elementor sometimes serves an old copy of the page's styles. Ask Claude to clear the Elementor cache for that page, or go to Elementor → Tools and click Regenerate Files & Data.

The design isn't what I pictured

Describe the gap in plain words: "too much empty space", "the font feels too formal", "I want the hero image on the right". Specific feedback gets better results than "make it better".

I want to start over

Undo the build's change group in the GoBuildWP change log, then send a new prompt.

Using ChatGPT, Cursor, VS Code or another MCP app

The process is the same in ChatGPT. Connect it to your site through GoBuildWP (Cloud or a direct MCP connection), paste the same prompt, and approve the steps when asked.

One thing to check first: custom connectors in ChatGPT depend on your plan, and in a business workspace on what your admin allows. If ChatGPT can read your site but won't make changes, look at the connector settings for your account before you blame the prompt.

You don't have to use a chat app at all. GoBuildWP is a standard MCP server, so any AI app that can connect to a remote MCP server can run this build. That includes AI code editors and terminal tools such as Claude Code, Cursor, VS Code, Codex, Windsurf and Antigravity. Connect AI to GoBuildWP Cloud has the setup steps for each of them, and WordPress MCP client configuration covers a direct connection to one site.

Two tips if you build from an editor. In Cursor and VS Code, send the prompt in Agent mode, because that's the mode that can call MCP tools. And an editor won't show you the pages it builds, so keep the site open in a browser and check each page as Step 4 describes.

Other ways to use AI with Elementor

GoBuildWP isn't the only option, and the right choice depends on how you like to work. Here's an honest summary of the main ones:

• Elementor AI. Elementor's own assistant lives inside the editor. It writes and rewrites text, creates images and generates sections while you build. It works with free Elementor, but after the free trial it runs on paid credits. It helps you build page by page; it doesn't take one prompt and build a whole site from a chat.
• Elementor MCP. Elementor now has its own MCP connection for AI tools like Claude. Its setup guide lists WordPress 6.8 or newer and Elementor and Elementor Pro 4.3.0 or newer, and it's aimed at the new Editor V4 elements. If your pages use classic widgets, or you don't have Elementor Pro, it may not fit. We compare the two in Elementor MCP vs GoBuildWP.
• Design first, rebuild later. Some people design a page in an AI chat as HTML and then rebuild it in Elementor by hand. That works, but you do the rebuilding yourself, and the result is only as editable as your rebuild.

The approach in this guide suits you if you want the AI to do the building inside your own WordPress site, with free Elementor, normal widgets, approvals and undo.

Video chapters

Where to go next

• See how GoBuildWP works with Elementor and which tools it has: MCP for Elementor
• What else the AI website builder for Elementor can do: Elementor AI website builder
• Compare GoBuildWP with Elementor's own MCP: Elementor MCP vs GoBuildWP
• Not using Elementor? Build a custom WordPress theme with AI