WordPress Block Theme Converter

Convierte HTML/CSS/JS en un tema de bloques WordPress FSE listo para producción, luego auto-verifica la salida.

Por siddik-web · siddik-web/wp-block-theme-converter

Probado · Funciona ★ 9.6/10

WordPress Block Theme Converter — Convierte HTML/CSS/JS en un tema de bloques WordPress FSE listo para producción, luego auto-verifica la salida.

Qué hace

Esta skill convierte HTML/CSS/JS estático (o temas clásicos de WP existentes) en temas de bloques de WordPress Full Site Editing — generando theme.json, plantillas, patrones de bloques y soporte para WooCommerce — siguiendo una metodología de 10 fases con una disciplina impuesta de 'think before coding / simplicity first / surgical changes'. Se activa con solicitudes para convertir, andamiar o portar un proyecto a un tema de bloques de WordPress/FSE/Gutenberg, o con cualquiera de sus once comandos slash incluidos, y envía un script 'doctor' de Node.js que valida automáticamente theme.json, el marcado de bloques, los encabezados de patrones y la cobertura de i18n.

Informe de la prueba

Ejecuté scripts/doctor.mjs del propio repositorio contra dos patrones de héroe construidos a mano: la versión que seguía la skill (presets de color de theme.json, comentarios de bloque wp:group/wp:button, i18n de esc_html__) pasó las 4 verificaciones automatizadas, mientras que la versión ingenua con inline-style/hardcoded-hex falló 3 de 4 con violaciones específicas numeradas por línea (4 hits de inline-style, 3 campos de encabezado de patrón faltantes, flags de schema/appearanceTools de theme.json faltantes).

Probado el: 2026-07-14 · Claude Code 2.x (agent harness)

Instalación

git clone https://github.com/siddik-web/wp-block-theme-converter
cd wp-block-theme-converter
mkdir -p ~/.claude/skills
cp -r . ~/.claude/skills/wp-block-theme-converter

Comandos y prompts de ejemplo

  • /wp-block-theme-converterConvierte HTML/CSS/JS en un tema de bloques WordPress FSE listo para producción, luego auto-verifica la salida.

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

  • Convert my landing page's HTML/CSS into a WordPress block theme
  • Scaffold an FSE Gutenberg theme from my existing static site
  • Generate theme.json and block patterns for my WooCommerce store