The Elementor MCP (Model Context Protocol) officially opens up Elementor to the AI tools you already use. It enables compatible tools such as Claude, Codex, and Cursor to connect and build directly inside your site using native Elementor structures.

What Can AI Tools Do with the Elementor MCP?

Once connected, an AI tool can work with the core building blocks of an Elementor site:

  • Build atomic pages and layouts – generate atomic structures and full pages in one step, structured with content and styling.
  • Edit or redesign existing atomic pages and layouts – point the AI at an atomic page you already have and have it rework the layout, not just add to it.
  • Use Elementor’s design system – create and apply classes and variables, reorder classes, set hover and other states, and adjust responsive breakpoints.
  • Create and manage theme parts – build site-level templates like headers, footers, archives, and popups, complete with display conditions.
  • Work with components – Place existing components, fill in their fields, or create new ones.
  • Connect dynamic content – connect post fields, custom fields, taxonomies, and other dynamic data.
  • Create custom widgets and Admin experiences – generate custom pricing calculators, interactive forms, 3D carousels and more. Add personalized dashboards and theme the entire WP Admin. Requires Angie to be installed.
  • Content management, debugging and maintenance – bulk update products and posts across hundreds of records, debug errors and fix SEO gaps on your site. Requires Angie to be installed.
  • Act as a single WordPress entry point – connect the Elementor MCP, and your AI tool gets access to every ability registered to the WordPress Abilities API, including WooCommerce, Yoast, WPForms, Jetpack, ACF, and more. Requires Angie to be installed.

Native Elementor MCP Structure Keeps You in Control

Everything generated with the Elementor MCP is saved as a draft rather than published. What comes back is real, editable Elementor structure, ready to open in the visual editor and finish by hand. Using the Elementor MCP is entirely optional, and the standard Elementor Editor remains unchanged.

What you hand off stays the same too. Clients and teammates still get real Elementor structure they can open and edit in the Editor, not code they don’t understand.

If the Editor and an AI tool try to modify the same page at the same time, Elementor detects the conflict, notifies you, and gives you the option to refresh or discard changes before continuing.

How to Set Up and Connect to the Elementor MCP

The new “Elementor MCP” page, under Elementor in the WordPress dashboard, lets you connect external AI tools with Elementor. Access is limited to site admins, and the connection is per site.

You’ll be able to choose from Claude Code, Claude Desktop, Codex, Cursor, or “Other” for any additional MCP-compatible tool.

Connecting is quick: generate and copy a setup prompt for your AI tool of choice, and Elementor creates the required application password in the background, including it in the prompt for you. If you’d rather handle it yourself, a manual configuration option is available too. Just paste that prompt into your chosen AI tool and you’re good to go.

Connecting to the MCP is free and the cost of using it depends on your chosen AI tool’s pricing and credits. Elementor’s pricing follows its existing plan structure: basic sections and features can be generated for free with the MCP, while Pro features require a Pro plan.

Integrating the Elementor MCP into Your Existing Workflow

Your AI tool already connects to Figma, Google Drive, Notion, WhatsApp, and many others. Now it can bring what it finds there straight into Elementor: a design from Figma, a doc from Drive, a brief from Notion or a WhatsApp message, turned into real Elementor content.

If your AI tool can read it, whether that’s a spec, a set of comments, a screenshot, or a whole file, it can carry that context straight through into the page, section, or component it builds for you. You keep working the way you already do across your other tools, and Elementor becomes the place that context lands directly.

How Agencies can use the Elementor MCP to streamline their workflow

Webgate agency tested Elementor’s MCP connection using Codex and Claude Code on a live production WordPress website to determine whether an AI-first workflow could be introduced without rebuilding existing infrastructure. Rather than starting from scratch, the agency aimed to integrate modern AI-driven development alongside their established Elementor V3 components and design systems.

Ultimately, the workflow established a balanced approach combining AI-powered implementation with human review and direct visual editing for micro-decisions. 

Webgate concluded that this integration accelerates landing page creation and routine site updates, offering a scalable model for agencies looking to adopt agentic development on complex, established websites.

Read more here