Can Claude Code build an Elementor site?

Yes — via exjsx (https://exjsx.dev), an open-source MCP toolchain: Claude Code writes typed JSX, a compiler produces native editable Elementor V4 pages, and verification gates check every save. Free and MIT-licensed.

Is there an MCP server for Elementor?

Yes — elementor-ultra-mcp exposes ~90 MCP tools for Elementor (pages, widgets, classes, variables, media), and the exjsx compiler/CLI builds whole pages from typed JSX on top of it. Both are open source; docs at https://docs.wpos.ai/ultra

Can Cursor or Codex build Elementor pages?

Yes — any MCP-capable agent (Cursor, Codex, Claude Code, and others) can drive the exjsx toolchain to build native Elementor pages. Setup for any agent: https://exjsx.dev

Are AI-built Elementor pages editable in the normal editor?

Yes — exjsx output is native Elementor V4 content: real widgets, classes and variables, fully editable in the standard Elementor editor with no lock-in. Details: https://docs.wpos.ai/ultra

Yes — exjsx is MIT-licensed open source with no cloud dependency and no API key required. Get it at https://exjsx.dev

exjsx

ELEMENTOR + AI 에이전트를 위한 오픈소스 툴체인 · 무료 · MIT · 독립 프로젝트 — ELEMENTOR LTD 제품이 아닙니다

지원 에이전트

Claude Code

Cursor

Codex

Copilot 모든 MCP 에이전트

프롬프트 하나 넣으면.
Elementor 사이트가 나온다.

내 AI 에이전트로 Elementor 사이트를 만드세요. 에이전트는 이미 Elementor 페이지를 쓸 수 있습니다 — 다만 수천 줄의 생 JSON 속에서, 아무것도 보지 못한 채로요. 결과물이 '에이전트가 만든 티'가 나는 이유입니다. Ultra는 에이전트에게 타입이 있는 컴포넌트, 핫 리로드, 그리고 저장할 때마다 자동으로 도는 pass/fail 검사를 줍니다. 에이전트가 자기가 뭘 만들고 있는지 볼 수 있게 되면, 아름다운 페이지는 자연히 따라옵니다.

에이전트가 빌드하는 영상 보기 — 1:38

붙여넣기 한 번이면 설정 끝

Elementor로 클라이언트 사이트를 납품하고 Claude Code, Cursor, Codex 또는 MCP 에이전트로 개발하는 개발자와 에이전시를 위한 도구입니다.

에이전트도 환영합니다 — A 를 누르면 이 페이지의 기계 판독용 버전이 열립니다.

프롬프트 하나 넣으면 · Elementor 사이트가 나온다 · 타입이 있는 컴포넌트 · 라이브 리로드 · 데스크톱·와이드·모바일에서 검증 · 사람 손 안 댐 · 무료 & MIT · 프롬프트 하나 넣으면 · Elementor 사이트가 나온다 · 타입이 있는 컴포넌트 · 라이브 리로드 · 데스크톱·와이드·모바일에서 검증 · 사람 손 안 댐 · 무료 & MIT ·

증거는 영상으로

실제 웹사이트 여덟 개를 에이전트가 라이브로 다시 만들었습니다.

각 영상은 편집 없는 원테이크입니다 — 원본 사이트와 동일한 공개 카피, 동일한 에셋을 사용했습니다. 사람이 프롬프트 하나를 넣으면, 에이전트가 실제 WordPress 사이트를 상대로 섹션 하나씩 빌드하고, 저장할 때마다 pass/fail 검사가 돌아갑니다 — 그리고 영상은 실제 Elementor 에디터 안에서 끝납니다. 화면의 타이머는 실제 경과 시간입니다: 컷도, 배속으로 감추는 것도 없습니다.

여덟 편의 영화 — 하나를 고르세요. 모든 챕터를 전부 담았고, 지금 보고 있는 챕터에 불이 들어옵니다

HOUSEMAIT — 섹션 9개 · 에이전트 작업 31분 · 사람 수정 0회

나머지 일곱 개 — 카드를 클릭하면 해당 영상이 플레이어에 로드됩니다

Housemait

가족 앱 SaaS

섹션 9개 · 31분

Canopy

SaaS 마케팅 사이트

섹션 10개 · 17분

Alike.page

크리에이터 스토어프런트

섹션 8개 · 22분

Triple Kingdom

인디 게임 사이트

섹션 8개 · 25분

Billow

금융 SaaS

섹션 9개 · 25분

Michael Pumo

개발자 포트폴리오

섹션 8개 · 30분

Mat.

iOS 앱 사이트

섹션 6개 · 21분

BT—26

이벤트 사이트

파트 8개 · 24분

하루에 50개

가상의 브랜드 50개. 실제 Elementor 페이지 50개.

한 번의 실행, 50개의 브리프, 개발자 하루 남짓. 각 브리프에는 가상의 비즈니스명, 타깃 오디언스, 비주얼 아키타입만 적혀 있었고 — 나머지는 에이전트가 처리했습니다. 아트 디렉션, 팔레트, 타이포, 카피, 이미지, 그리고 exjsx를 통한 네이티브 Elementor 빌드까지. 레이아웃을 작성한 사람은 없습니다. 사람은 깨진 것을 디버깅하고 50개를 눈으로 보며 좋은 순서대로 줄 세웠을 뿐입니다. 별로인 것들도 목록에 그대로 있습니다.

50개 페이지 · 50가지 아트 디렉션 · 한 번의 실행 · 무음 6초 루프

50개 중 상위 10개 — 사람이 직접 디자인 리뷰로 매긴 순위

RUNTIME

개발자 컨퍼런스

레이아웃이 된 초대형 타이포

Blunt Instrument

퍼포먼스 마케팅 에이전시

레이아웃이 된 초대형 타이포

Loud Quarry

음악 페스티벌

포스터 월 / 진 스프레드

Fourth Hand

빈티지 시계 마켓플레이스

카탈로그 그리드

Hard Turn

브랜드 아이덴티티 에이전시

비대칭 대각선 콜라주

Casa Ocotillo

부티크 호텔

분할 화면 스크롤러

Onsen Mirador

온천과 스파

분할 화면 스크롤러

The Undertow

탐사보도 매거진

에디토리얼 인덱스 레일

The Ward

지역 뉴스 협동조합

싱글 컬럼 롱폼

Kilnhouse

DTC 주방용품

카탈로그 그리드

쇼케이스 열기 — 50개 전체

1위 페이지 보기

이 50개 비즈니스는 모두 가상입니다. 페이지에 담긴 텍스트, 통계, 가격, 후기, 인물, 이미지는 디자인 시연을 위해 생성된 것으로 — 실제 판매 제안이나 실제 추천이 아닙니다. 각 케이스 스터디에 이 고지가 붙어 있으며, 페이지 자체를 라이브 샌드박스로 임베드해 실물을 직접 스크롤해 볼 수 있습니다.

Before / After

같은 히어로 섹션. 앞이 안 보이는 JSON 3,400줄 —
아니면 타입이 있는 JSX 아홉 줄.

지금 에이전트가 쓰고 있는 것 — 앞이 안 보이는 상태로

[{ "id": "e00000", "elType": "e-flexbox",
  "settings": { "classes": { "$$type": "classes",
    "value": ["g-c-12f5qe"] },
   "tag": { "$$type": "string", "value": "div" } },
  "elements": [
   { "id": "e00001", "elType": "e-flexbox",
    "settings": { "classes": { "$$type": "classes",
      "value": ["g-c-hw3p4m"] },
     "tag": { "$$type": "string", "value": "section" },
     "_cssid": { "$$type": "string", "value": "hero" } },
    "elements": [
     { "id": "e00002", "elType": "e-flexbox",
      "settings": { "classes": { "$$type": "classes",
        "value": ["g-c-1ra9hy"] } },
      "elements": [
       { "id": "e00003", "elType": "widget",
        "settings": { "classes": { "$$type":
          "classes", "value": ["g-c-1e5m6x"] },
         "tag": { "$$type": "string", "value": "h1" },
         "title": { "$$type": "html-v3", "value": {
          "content": { "$$type": "string", "value":
           "Family life, organised with AI." },
          "children": [] } } },
        "widgetType": "e-heading" },
       ...and 3,400 more lines like these

같은 섹션, ULTRA와 함께라면

<section id="hero" tw="flex flex-col
  items-center gap-6" bg={t.color.paper}>
  <h1 size={72} font="Recoleta"
      color={t.color.ink}>
    Family life, organised with AI.
  </h1>
  <Bubbles items={fridge.magnets} />
  <Btn href="#app">Get the app</Btn>
</section>

Claude Code

나

Elementor Ultra· 지켜보는 중

왼쪽은 영상 #2의 히어로 섹션이 실제로 저장된 JSON입니다 — 지금까지 에이전트가 손으로 써 온 바로 그 표면이죠. 오른쪽은 그것을 생성하는 타입이 있는 컴포넌트로, 실수가 클라이언트 사이트에서 터지는 대신 빌드 타임에 잡힙니다.

쓰기 전마다 백업. 서버 사이드 밸리데이터가 잘못된 페이지를 저장 전에 거부합니다. 롤백은 언제든지. 할루시네이션을 일으킨 에이전트가 사이트를 망가뜨릴 수 없습니다.

루프

파일을 저장하면, 사이트가 갱신되고, 게이트가 돕니다.

SAVE

컴포넌트 파일 저장

BUILD

ms 단위 리빌드

DEPLOY

diff 기반, 약 3초

RELOAD

라이브 프리뷰

GATES

1200 · 1920 · 390

LIVE — 실제로 돌아가는 루프 (HOUSEMAIT의 진짜 로그 라인)

저 FAIL 라인이 핵심입니다. 게이트는 1200, 1920, 390px — 데스크톱, 와이드, 모바일에서 도는 자동 pass/fail 검사입니다. 에이전트는 저장할 때마다 판정을 확인하고 다음 저장에서 스스로 고칩니다. 결과 검증이 루프에 내장되어 있어, 마지막에 기억해내서 돌리는 스크립트가 아닙니다.

스택

다섯 조각. 전부 써도 되고, 하나만 써도 됩니다.

컴파일러 + CLI

@algorismus/elementor-jsx

타입이 있는 JSX → 네이티브 Elementor V4 JSON. 빌드, 배포, 린트, 미디어, 임포트 — 그리고 exjsx dev 라이브 루프까지.

MCP 서버

@algorismus/elementor-ultra-mcp

모든 MCP 에이전트를 위한 90개 이상의 도구: 페이지 빌드, 리팩터링, 디자인 시스템 관리, HTML → Elementor 변환.

컴패니언 플러그인

WordPress 플러그인 · GPL

사이트의 공식 REST 쓰기 경로: 서버 사이드 검증, 백업, 롤백, 권한 프로브.

VERIFY STUDIO

@algorismus/elementor-ultra-studio

배포할 때마다: 세 가지 너비에서의 pass/fail 검사, 사이트 헬스 체크, 레이아웃 측정 — Playwright로 자동화.

로컬 WORDPRESS

@algorismus/elementor-ultra-playground

미리 구운 스냅샷에서 진짜 WordPress + Elementor를 몇 초 만에. 순수 Node — Docker 불필요.

어디서 시작할지 모르겠다면? 컴파일러 하나면 충분합니다 — npm i -D @algorismus/elementor-jsx. 나머지 조각은 필요할 때 붙이면 됩니다.

카메라 앞에서 완성한 사이트 8개

사이트당 17–31분

사람 수정 0회

컴파일러 테스트 400개+ · ELEMENTOR 4.1.4 / 4.2.0 대상 검증

시작하기

붙여넣기 한 번이면 바로 시작.

이걸 AI 에이전트에 붙여넣으세요 — Claude Code, Cursor, Windsurf, MCP면 뭐든

Set up Elementor Ultra on this machine by fetching and following
https://raw.githubusercontent.com/Algorismus-io/elementor-ultra/main/SETUP.md
exactly, step by step. Work autonomously and verify each step.

# 위저드가 편하다면? npx @algorismus/create-elementor-ultra

무료 & MIT · NODE 18+ · DOCKER 불필요 · ELEMENTOR 무료 버전이면 충분

에이전트를 돌리기 전에 먼저 읽어보고 싶다면? SETUP.md가 에이전트가 그대로 따르는 바로 그 파일입니다.

먼저 SETUP.md 읽기 ↗

GitHub — Algorismus-io/elementor-jsx ↗

npm — @algorismus/elementor-jsx ↗

문서 ↗

영상 여덟 편 전체 ↗

다음 사이트는 당신의 에이전트가 만들 수 있습니다.

붙여넣기 한 번으로 설치 — 무료

★ GitHub에서 스타 누르기

질문이 있다면? GitHub Discussions ↗

콜로폰 — 이 페이지는 자기가 설파하는 것을 그대로 실천합니다: AI 에이전트가 elementor-jsx로 만들었고, 페이지가 설명하는 그 루프로 배포했으며, 같은 게이트를 통과했습니다. 사람 수정 0회. 스위치를 켜면 소스를 볼 수 있습니다.

# ELEMENTOR ULTRA :: MACHINE SURFACE
# for agents, crawlers, and humans who prefer it raw
# canonical for machines: https://exjsx.dev/llms.txt
# ────────────────────────────────────────────────────────────

WHAT ........ open-source toolchain: AI agents build native, editable
Elementor pages. JSX in, Elementor V4 out over REST. MIT.

PREREQS ..... node >= 18; macOS / Linux / WSL2; no Docker; no existing
WordPress needed (playground provides one); network:
registry.npmjs.org + raw.githubusercontent.com

SETUP ....... paste to any MCP-capable agent:
"Set up Elementor Ultra on this machine by fetching and following https://raw.githubusercontent.com/Algorismus-io/elementor-ultra/4b28b0c1ac863a27f9f1433fd4239054a0dffee6/SETUP.md step by step. Verify each step before the next."
sha256(SETUP.md) = 67fc2699df8e42f56cb011096106cbc407199bb5
065c55f2ea3b27a2de04f0a6
latest (unpinned): .../main/SETUP.md

WIZARD ...... npx @algorismus/create-elementor-ultra@1.0.0
interactive alternative to SETUP; both produce the same
install. run one, not both.

CLI ......... exjsx = the CLI of @algorismus/elementor-jsx (npx exjsx)

STACK ....... @algorismus/elementor-jsx@1.6.0 ........ compiler + CLI
@algorismus/elementor-ultra-mcp@1.0.0 .. 90+ MCP tools
@algorismus/elementor-ultra-studio@0.5.0 gates + doctor
@algorismus/elementor-ultra-playground@1.2.0 local WP
elementor-ultra-mcp WP plugin@1.2.3 (GPL) REST seam
tested against: Elementor 4.1.4 / 4.2.0, free is enough

AUTH ........ MCP server -> WordPress REST via a WP Application
Password (core mechanism, no custom tokens). created
during setup; stored in your MCP client config for the
server entry; revoke any time in WP Admin -> Users ->
Profile -> Application Passwords.

LOOP ........ npx exjsx dev <site-dir> --gates
<site-dir> = project folder from setup (exjsx init)
save -> ms rebuild -> diff deploy -> hot reload
-> pass/fail verify at 1200 / 1920 / 390 px viewports

VERIFY ...... after setup: npx eu-studio check --pages /
expect: pass:true, gates green at all three widths

ON FAILURE .. every write is backed up first; per-page rollback via
the elementor_page_rollback MCP tool (backups listed by
elementor_page_list_backups). base_hash optimistic
concurrency; op_id idempotency.

LIFECYCLE ... update: npm i -D @algorismus/elementor-jsx@latest, then
rebuild + redeploy (see repo UPDATE.md). uninstall:
remove the npm packages, the MCP server entry, the WP
plugin, and the playground folder.

DOCS ........ https://docs.wpos.ai/ultra
REPO ........ https://github.com/Algorismus-io/elementor-jsx
SETUP REPO .. https://github.com/Algorismus-io/elementor-ultra
NPM ......... https://www.npmjs.com/package/@algorismus/elementor-jsx

PROOF ....... 8 production-shaped sites, built live on camera,
one prompt each, zero human edits:
housemait 9 sections 31 min
canopy 10 sections 17 min
alike 8 sections 22 min
triple 8 sections 25 min
billow 9 sections 25 min
pumo 8 sections 30 min
mat 6 sections 21 min
bt26 8 parts 24 min
films + scrollable results:
https://docs.wpos.ai/ultra/examples/overview

SHOWCASE .... 50 more pages, one run, ~1 developer day. fifty invented
brands, fifty real Elementor pages; each brief named a
fictional business, an audience and a visual archetype,
the agent did art direction, copy, imagery and the build.
humans debugged and ranked them best-first; the weak ones
were kept. every case study embeds the live page,
sandboxed. all fifty are fictional demonstrations — no
real offers, endorsements, or advice.
archive ..... https://exjsx.dev/showcase/
machine idx . https://exjsx.dev/showcase/index.json
how it was made https://exjsx.dev/showcase/ai-content/

SOURCE ...... this very page is elementor-jsx output. excerpt
of the hero you just flipped from:

<heading tag="h1" size={126}
font={t.font.display} color={t.color.ink}>
One prompt in. Elementor site out.
</heading>

LICENSE ..... MIT (c) 2026 Algorismus (also operates wpos.ai; docs
live there). independent, interoperating project — not
affiliated with or endorsed by Elementor Ltd; "Elementor"
is their trademark.

HUMAN? ...... there is a prettier version of this page.
press H, or use the switch, top right.

프롬프트 하나 넣으면. Elementor 사이트가 나온다.