Skip to content
Book a Discovery Call

Guides

/ Free guide

Free guide for Elementor site owners, developers and agencies

Building with Claude Code and Elementor MCP

A hands-on guide from our rebuild of nivo.co.uk: setup, workflow, prompts and the problems we hit.

Written from our own experience rebuilding a 71-page Elementor website with Claude Code and Elementor MCP. Every section separates what we did from Elementor's official guidance, so you can tell which is which.

PDF · 24 pages Free Elementor docs checked 5 November 2026
Section 11 of the guide: What went wrong, and how we fixed it, as a two-column table
Section 2 of the guide: How we wrote this guide, with the rebuild at a glance figures
Cover of the Building with Claude Code and Elementor MCP guide by Nivo Digital
24 pages · from a real rebuild

From our own rebuild

What we built, and what the guide is based on

We rebuilt nivo.co.uk on a private staging copy and launched it in October 2026. These are our own project figures, not industry benchmarks.

71 Pages in the rebuild
50 Reusable section layouts in our library
10 Reusable components
22 Global classes
27 Global variables

The rebuild at a glance, as launched in October 2026. Time figures are estimates from experience, not measured build times.

Sadie's estimate for a standard page

Sadie O'Callaghan, our Website Department Lead, estimates the time saved on a standard page. The guide explains where the time goes, and what still needs a person.

Manually in Elementor, before

2 to 4 hours

depending on complexity
With Claude Code and Elementor MCP

30 to 60 minutes

including reviewing the layout and making adjustments

Inside the guide

Have a look before you download it

Pick a part of the guide to see a real page from it. Each section is labelled so you can tell our own experience from Elementor's official guidance, checked on 5 November 2026.

Section 3 of the guide: a diagram of how Claude Code connects to Elementor MCP on a WordPress site
Section 03

What Elementor MCP is and how Claude Code uses it

A diagram of how Claude Code reaches your site, and what Elementor says a connected AI tool can and can't do.

Inside this part

Claude Code signs in as one WordPress user, and can do anything that user can do

Elementor MCP works with Atomic (V4) elements only, for now

Which capabilities need Elementor Pro

Page shown: a real page from the guide
All 15 sections
01 Who this guide is for
02 How we wrote this guide
03 What Elementor MCP is and how Claude Code uses it
04 What you need before you start
05 Connecting Claude Code to Elementor MCP
06 Start on a staging site, then move to the live website
07 Worked example: adding a section to a page
08 A real example: three service cards
09 Prompts that work
10 Keeping the design consistent
11 What went wrong, and how we fixed it
12 Sharing screenshots and recordings safely
13 Quick-reference checklists
14 Next steps
15 Sources and further reading

Who it's for

For people who have to keep the site running afterwards

By the end, you'll know how to connect Claude Code to Elementor MCP, build safely on draft copies, write prompts that do what you mean, and avoid the problems we ran into.

01

Elementor site owners and in-house web teams

Deciding whether to connect an AI tool to their site.

02

Agencies and freelancers

Who want to see how the workflow holds up on a real build.

03

Anyone who's seen a “build a website in minutes” video

And wants to know what happens on a site you have to keep running.

Before you start

Our workflow relied on Claude Code and a few small Python scripts. It suits someone at ease with technical tools, rather than anyone looking for a no-code setup.

What it isn't

It isn't a results case study. We haven't measured site speed, traffic or enquiries, so the guide makes no claims about them.

How we wrote it

Our experience and Elementor's advice, kept apart

Elementor is developing MCP quickly, so some of the problems we describe may be fixed in your version. The guide says so where it matters, and points you to Elementor's documentation for the current requirements.

What we did

Our own experience from the nivo.co.uk rebuild, September and October 2026. Not universal rules.

Elementor's guidance

Taken from Elementor's official documentation, checked on 5 November 2026, with links so you can check the current position.

Get the free guide

Get your free copy of the guide

Enter your first name and email address, and you can download the PDF straight away.

The routine we used on our own 71-page rebuild

Prompts that worked, and the five things they always covered

Every problem we hit, and what we do now

Three printable checklists

Free PDF · 24 pages

Get instant access

We'll use your details to give you the guide and keep a record of your request. We'll only send you marketing emails if you tick the box. See our privacy policy.

This form is protected by reCAPTCHA. Google's Privacy Policy and Terms of Service apply.

Who wrote it

Written by the Nivo Digital team from our own rebuild of nivo.co.uk, with time estimates from Sadie O'Callaghan, our Website Department Lead. We still use this routine to update the live site.

“Claude and Elementor MCP don't replace the design and development process, but significantly speed up the repetitive parts of it.”

Sadie O'Callaghan · Website Department Lead, Nivo Digital

Related

More on Elementor v4 and our rebuild

Behind the scenes

How we rebuilt Nivo's own website with Elementor MCP + Claude

The project this guide is based on.

Read more →
Guide

Should you upgrade to Elementor v4?

Elementor MCP only edits Atomic (V4) elements. Start here if your site is still on V3.

Read more →
Free checklist

Elementor v4 Readiness Checklist

A 16-page workbook for preparing your site for Elementor v4.

Read more →
Service

Elementor v4 upgrade

Have the checks, staging work and rebuild planned and done for you.

View the service →

Want help instead?

Book a discovery call to talk through your site

We're Elementor specialists. We design, build, migrate, host and maintain Elementor websites, and we use the routine in this guide on our own site.

Nivo Digital
Privacy Overview

At Nivo Digital, we are committed to protecting your privacy and ensuring that your personal information is handled in a safe and responsible way. This Privacy Policy outlines how we collect, use and protect your information when you use our website https://nivo.co.uk. By using our website, you agree to the terms of this Privacy Policy.