AI assistant plugin for Webentor-stack WordPress projects — Bedrock + Sage 11 + Acorn 5 + Herd + pnpm + Vite 7 + Tailwind v4 + webentor-core. Works with Claude Code, VS Code (GitHub Copilot), and Cursor.
| Requirement | Version |
|---|---|
| Laravel Herd | Latest |
| PHP | 8.3+ |
| Node.js | 20+ |
| pnpm | 10+ |
| Sage + Acorn | 11 / 5 |
| webentor-core | ^0.9 |
Install directly from GitHub via the Claude Code plugin marketplace:
/plugin marketplace add Webikon/superpowers-webentor
/plugin install superpowers-webentor@superpowers-webentor-marketplace
To update later, re-run the marketplace add command (it pulls the latest commit) and reinstall.
The first time a hook fires in a project that uses this plugin, it creates a
.superpowers-webentor/ cache directory (currently just hooks.log — the
shared hook log used by every hook script). When the project is a git
repository, the cache dir is automatically added to the project's
.gitignore so the log never ends up in commits.
If your project's .gitignore already has .superpowers-webentor/ (with or
without the trailing slash), nothing changes. The auto-add is silent on
non-git directories and on directories where SUPERPOWERS_WEBENTOR_HOOK_LOG
has been overridden to point elsewhere.
These MCP integrations unlock the /designing and /verifying skills. Pick one of Stitch or Figma for design extraction, plus Playwright for visual verification:
# Pick one — Stitch OR Figma (recommended for design extraction)
claude mcp add stitch -- npx -y @anthropic/stitch-mcp
claude mcp add figma -- npx -y figma-developer-mcp --figma-api-key=YOUR_KEY
# Recommended for /verifying (screenshot comparison)
claude mcp add playwright -- npx -y @anthropic/playwright-mcpWhen starting a brand new client project, run these in order:
/project-init → running site at https://<slug>.test
/design-system → colors + typography in @theme + webentor-config.ts
/architecture-discovery full site → page inventory + content model + architecture + plan
/building → implement section by section from the plan
/reviewing → convention audit before shipping
For adding a feature to an existing project:
/architecture-discovery → approved spec
/plan-generator → plan + assets + content model
/building → implement from plan, verify each component
/reviewing → convention audit + design alignment
| Command | What it does |
|---|---|
/project-init |
New project bootstrap: starter + Herd + 1Password + setup script |
/design-system |
Extract design tokens (colors, typography) and configure @theme + webentor-config.ts |
/onboarding |
Analyze an existing project's state and suggest next steps |
/architecture-discovery |
Architecture discovery with hard gates and reviewer loop. Pass full site for project-wide scope with page inventory |
/plan-generator |
Converts approved spec into executable plan + dependency graph |
/architecting |
Compatibility wrapper: runs architecture-discovery then plan-generator |
/modeling |
Content classification: static vs dynamic, recommend extended-cpts/ACF |
/designing |
Per-section design extraction (references docs/design-system.md tokens when available) |
/building |
Plan-driven implementation with auto-verification after each component |
/verifying |
Visual comparison: screenshots vs design reference |
/reviewing |
Convention audit + design alignment check |
/debugging |
Webentor-aware troubleshooting (Herd, Vite, pnpm, webentor-core) |
/install-plugin |
Install WordPress plugins via Composer (Bedrock) |
Webentor-specific:
- webentor-stack — Bedrock + Herd + pnpm + Vite + Tailwind v4 + ACF Composer + extended-cpts + Blade
- webentor-core — e-*/l-* block catalog, Alpine/Slider wrappers, buildSafelist, block components/filters
- webentor-setup — Fresh starter vs setup-core consumer bootstrap
Acorn features (reference, not all used in default starter):
- acorn-commands, acorn-routes, acorn-eloquent, acorn-middleware, acorn-queues, acorn-redis, acorn-logging, acorn-livewire
WordPress:
- wp-block-native, wp-capabilities, wp-cli-ops, wp-hooks-lifecycle, wp-performance, wp-phpstan, wp-rest-api, wp-security
| Agent | Purpose |
|---|---|
webentor-architect |
Analyze requirements and produce Architecture Decision Records |
webentor-reviewer |
Audit code against Webentor-stack conventions |
webentor-debugger |
Systematic diagnostics for Webentor/Herd/Vite issues |
content-modeler |
Classify content: static, dynamic CPT, Options Page, relational |
visual-verifier |
Compare screenshots against design reference |
design-extractor |
Extract design specs from Figma/Stitch/local images |
Zero-token automation that runs without consuming LLM context:
| Hook | Trigger | What it does |
|---|---|---|
| session-start | Every session | Detect project, webentor-core versions, Herd site, design tools |
| post-edit | After Write/Edit | wp acorn optimize:clear for PHP; pnpm build for assets |
| post-compact | Context compression | Re-inject active plan path and asset count |
| pre-commit | Before git commit |
Remind to lint + verify visually against design reference |
| post-subagent | Subagent completes | Log activity to plan directory |
| post-stop | Session ends | Log session end to plan directory |
| Scenario | Use | Avoid |
|---|---|---|
| Layout container | l-section / l-flexible-container (webentor-core) |
Custom container blocks |
| Post loop | e-query-loop + e-post-template (webentor-core) |
Raw WP_Query in Blade |
| Content types | extended-cpts in app/cpts-tax.php |
register_post_type(), Poet |
| Global config | ACF Options Pages (ACF Composer) | wp_options directly |
| Business logic | Service class or Provider | Fat controllers |
| Interactive UI | Alpine via webentor-core _alpine.ts |
Heavy custom JS |
| Static UI | Blade Component | Shortcodes |
| Fields & Blocks | ACF Composer | ACF GUI |
| Carousel | webentor-core _slider.ts |
Direct Swiper |
| Dynamic Tailwind | buildSafelist() |
Arbitrary values |
| Package manager | pnpm | yarn / npm |
| Dev environment | Herd | Lando / Docker |
MIT (forked from superpowers-sage by codigodoleo)