WordPress Block Theme Converter

Konvertiert HTML/CSS/JS in ein produktionsreifes WordPress FSE Block-Theme und überprüft dann die Ausgabe selbst.

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

Getestet · Funktioniert ★ 9.6/10

WordPress Block Theme Converter — Konvertiert HTML/CSS/JS in ein produktionsreifes WordPress FSE Block-Theme und überprüft dann die Ausgabe selbst.

Was es kann

Dieser Skill konvertiert statisches HTML/CSS/JS (oder bestehende klassische WP-Themes) in WordPress Full Site Editing Block-Themes – generiert theme.json, Templates, Block-Patterns und WooCommerce-Unterstützung – nach einer 10-phasigen Methodik mit einer durchgesetzten Disziplin 'think before coding / simplicity first / surgical changes'. Er wird bei Anfragen zum Konvertieren, Gerüstbau oder Portieren eines Projekts zu einem WordPress/FSE/Gutenberg Block-Theme oder bei einem seiner elf gebündelten Slash-Befehle ausgelöst und liefert ein Node.js 'doctor'-Skript, das theme.json, Block-Markup, Pattern-Header und i18n-Abdeckung automatisch validiert.

Testbericht

Habe die repo-eigenen scripts/doctor.mjs gegen zwei handgefertigte Hero-Patterns ausgeführt: Die Skill-konforme Version (theme.json color presets, wp:group/wp:button block comments, esc_html__ i18n) bestand alle 4 automatisierten Prüfungen, während die naive Inline-Style/Hardcoded-Hex-Version 3 von 4 mit spezifischen zeilennummerierten Verstößen (4 Inline-Style-Treffer, 3 fehlende Pattern-Header-Felder, fehlende theme.json schema/appearanceTools-Flags) fehlschlug.

Getestet am: 2026-07-14 · Claude Code 2.x (agent harness)

Installation

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

Befehle & Beispiel-Prompts

  • /wp-block-theme-converterKonvertiert HTML/CSS/JS in ein produktionsreifes WordPress FSE Block-Theme und überprüft dann die Ausgabe selbst.

Skills reagieren auf normale Anfragen — keine Slash-Befehle nötig. Nach der Installation aktivieren Prompts wie diese den Skill (auf Englisch):

  • 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