Back to the catalog

perxel-blocks

Scaffold, audit and manage custom ACF Gutenberg blocks for WordPress with Tailwind CSS integration. Tested with NectarBlocks.

Open source Open in the app JSON README (API)

About

Scaffold, audit and manage custom ACF Gutenberg blocks for WordPress with Tailwind CSS integration. Tested with NectarBlocks.

Details

Kind
Plugins
Topic
Developer tools
Publisher
perxel
Origin
marketplace
Category
ferramentas
Stars
1
Last push
2026-05-06T09:32:12Z
Repository state
arquivado
Language
JavaScript
License
MIT
Added
2026-08-30 01:48:58
Updated
2026-08-30 01:48:58
Origin id
perxel/perxel-blocks/perxel-blocks

README

# WP Blocks Dev

A **[Claude Code](https://claude.ai/code) plugin** for scaffolding, auditing, and managing custom ACF Gutenberg blocks for WordPress — with Tailwind CSS integration and a structured, production-ready workflow.

## Install

**From GitHub:**

```bash
claude plugin marketplace add phucbm/wp-blocks-dev
claude plugin install wp-blocks-dev@phucbm --scope project
```

## Update

```bash
claude plugin update wp-blocks-dev@phucbm
```

> Always bump `version` in `.claude-plugin/plugin.json` when publishing — Claude Code uses it to detect updates.

---

## Skills

| Skill | Example prompt | What it does |
|---|---|---|
| `/wp-blocks-dev:init` | `/wp-blocks-dev:init my-client-site` | Scaffold a new WordPress theme — asks for project name, slug, author, and optional features (Tailwind, TypeScript), then creates the full theme structure |
| `/wp-blocks-dev:create-block` | `/wp-blocks-dev:create-block hero-banner` | Scaffold a new ACF block — generates `block.json`, `fields.json`, `render.php`, and registers it in `blocks.json` |
| `/wp-blocks-dev:audit-blocks` | `/wp-blocks-dev:audit-blocks` | Fast structural audit — checks all blocks for missing files, invalid timestamps, unregistered folders. No AI, runs in seconds |
| `/wp-blocks-dev:audit-blocks-deep` | `/wp-blocks-dev:audit-blocks-deep` | Deep AI audit — reviews block labels, field quality, admin render justification, and empty-state messages across the project |

## Agent

| Agent | Example prompt | What it does |
|---|---|---|
| `wp-blocks-dev` | `@wp-blocks-dev should this block have render-admin.php?` | Expert on the full stack — ask anything about block structure, ACF fields, PHP patterns, asset loading, or Tailwind. No context needed, it knows the workflow. |

## Hooks

| Hook | Trigger | What it does |
|---|---|---|
| `fields.json` reminder | Any edit or write to `fields.json` | Reminds you to run `date +%s` and update the `modified` timestamp — ACF uses this for field group sync detection |

---

## Required mu-plugins

Install all three from [phucbm/wp-mu-plugins](https://github.com/phucbm/wp-mu-plugins) into your `mu-plugins/` directory:

| File | Purpose |
|---|---|
| [`acf-local-json-router.php`](https://github.com/phucbm/wp-mu-plugins/blob/main/acf-local-json-router.php) | Routes ACF JSON saves per-block to `blocks/{slug}/fields.json` |
| [`wp-blocks-loader.php`](https://github.com/phucbm/wp-mu-plugins/blob/main/wp-blocks-loader.php) | Registers blocks from `blocks.json`, adds block category, fixes WP 6.3+ script defer |
| [`tailwind-theme-loader.php`](https://github.com/phucbm/wp-mu-plugins/blob/main/tailwind-theme-loader.php) | Enqueues Tailwind CSS on frontend and in the block editor |

---

## Requirements

- WordPress 6.0+
- ACF Pro
- PHP 8.0+
- Node.js + pnpm (if using Tailwind or TypeScript)

## License

MIT — [phucbm](https://github.com/phucbm)

More