HTML2Elementor

Convierte HTML+CSS a JSON de Elementor, con un verificador que comprueba la cascada

Por dudaster · dudaster/html2elementor

Probado · Funciona ★ 7.6/10

HTML2Elementor — Convierte HTML+CSS a JSON de Elementor, con un verificador que comprueba la cascada

Qué hace

Un local Python converter que turns an HTML page con su CSS into an Elementor _elementor_data payload plus a kit file de custom colour y typography globals, then verifies the result node-by-node against the source. Se activa cuando se paste o point at HTML y se desea como an Elementor page en WordPress: "convert this landing to Elementor", "Elementor JSON from this markup", "bring this Tailwind mockup into WordPress". Handles CSS custom properties, grid detection, per-side borders y absolute positioning que hand-written Elementor JSON usually loses.

Informe de la prueba

Se convirtió una fresh 3-section landing page y se scored it against a hand-written Elementor JSON de la same page using the repo's own verifier: el converter came back con 0 issues, la hand-built version con 16 — inherited var(--muted) text colours, hero max-widths y every margin-bottom silently lost. It also resolved var(--brand) into hashed page-unique colour globals, derived a button hover shade y emitted tablet/mobile flex breakpoints que nobody writes by hand. Two documentation faults cost it: la invocation printed en SKILL.md dies con ModuleNotFoundError cuando se run from the install directory (el package resolves only from the parent dir), y --upload plus el referenced playsand/cleanup_kit.sh depend on a docker sandbox that is not in the repo, so image upload silently no-ops. A page whose content is not inside semantic <section> tags converted to an empty layout.

Probado el: 2026-08-10 · Claude Code 2.x (agent harness)

Instalación

mkdir -p ~/.claude/skills
git clone https://github.com/dudaster/html2elementor.git ~/.claude/skills/html2elementor
cd ~/.claude/skills/html2elementor && python3 -m venv .venv && .venv/bin/pip install -r requirements.txt

Comandos y prompts de ejemplo

  • /html2elementorConvierte HTML+CSS a JSON de Elementor, con un verificador que comprueba la cascada

Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):

  • Convert this HTML landing page into Elementor JSON I can import
  • Turn my CSS custom-properties page into an Elementor kit file
  • Convert this dark CTA band section to Elementor page data