Stats
Actions
Tags
From cklph-figma-to-wp
Entry point for translating a Figma design into a WordPress/Elementor page or template. Use at the start of any "build this Figma design in WP/Elementor" task to set up the pipeline and route to the right plugin for each step.
How this skill is triggered — by the user, by Claude, or both
Slash command
/cklph-figma-to-wp:start-hereThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Translating a design into Elementor is a **loop**, not a one-shot generate. Set up the connection,
Translating a design into Elementor is a loop, not a one-shot generate. Set up the connection, learn the site, build on a safe copy, and verify against the pixels every pass. This plugin is thin glue — each step lives in a focused plugin; invoke those skills by name.
wp-connect, site-profile (cklph-wp).figma-read, figma-tokens (cklph-figma).tree two or three existing pages; read the Kit; record findings in the
profile. Write code for the installed versions. → elementor-data, elementor-templates
(cklph-elementor); tokenize (this plugin); version-docs (cklph-wp)._elementor_data; write; flush-css. → elementor-data, elementor-styling, elementor-templates.visual-verify, visual-reviewer (cklph-visual-qa).elementor-responsive.elementor-templates.tokenize.visual-verify.Run the loop directly, or use translate (this plugin) for the step-by-step orchestration. For a
high-stakes match, hand the verify step to the visual-reviewer agent for an adversarial pass.
If a plugin in the chain isn't installed, install it (cklph-wp, cklph-elementor, cklph-figma,
cklph-visual-qa) — the pipeline assumes all four.
Provides a checklist for code reviews covering functionality, security, performance, maintainability, tests, and quality. Use for pull requests, audits, team standards, and developer training.
npx claudepluginhub chykalophia/cklph-marketplace --plugin cklph-figma-to-wp