Skip to main content
Glama
README.md
# Proto-Blocks MCP Server

The **Ultimate MCP Server** for Proto-Blocks - providing comprehensive AI guidance for creating WordPress Gutenberg blocks with PHP templates.

## Features

- **12 Specialized Tools** for Proto-Blocks development guidance
- **Complete Documentation** covering all aspects of block creation
- **Examples** from basic to expert level complexity
- **Troubleshooting Guides** for common issues
- **Block Generator** to create blocks from descriptions
- **No Build Step Required** - runs directly with npx

## Installation

### Claude Desktop

Add to your Claude Desktop configuration (`claude_desktop_config.json`):

```json
{
  "mcpServers": {
    "Proto-Blocks MCP": {
      "command": "npx",
      "args": ["-y", "github:GustavoGomez092/proto-blocks-mcp"]
    }
  }
}
```

### Local Development

```bash
cd mcp
npm install
node index.js
```

## Available Tools

### Getting Started
- **`proto_blocks_get_started`** - Comprehensive introduction to Proto-Blocks
- **`proto_blocks_quick_reference`** - Quick cheat sheet for common patterns

### Documentation
- **`proto_blocks_field_types`** - Complete field type documentation (text, wysiwyg, image, link, repeater, innerblocks)
- **`proto_blocks_control_types`** - Complete control type documentation (text, select, toggle, range, color, etc.)
- **`proto_blocks_templates`** - PHP template patterns and best practices
- **`proto_blocks_styling`** - Styling with Vanilla CSS or Tailwind
- **`proto_blocks_interactivity`** - Frontend interactivity (plain JS, ES modules, WordPress Interactivity API)
- **`proto_blocks_schema`** - Complete block.json schema reference

### Examples & Troubleshooting
- **`proto_blocks_examples`** - Working examples at all complexity levels (basic, intermediate, advanced, expert)
- **`proto_blocks_troubleshooting`** - Solutions for common issues

### Advanced Features
- **`proto_blocks_repeaters`** - Comprehensive guide to repeaters (basic to complex, nested repeaters, Interactivity API integration)

### Block Generation
- **`proto_blocks_generate`** - Generate complete blocks from a description

## Usage Examples

### Get Started
```
Use the proto_blocks_get_started tool to learn about Proto-Blocks
```

### Get Field Details
```
Use proto_blocks_field_types with fieldType="repeater" to learn about repeater fields
```

### Get Examples
```
Use proto_blocks_examples with complexity="advanced" for advanced examples
```

### Learn About Repeaters
```
Use proto_blocks_repeaters for complete repeater documentation
Use proto_blocks_repeaters with topic="nested" for nested repeater patterns
```

### Generate a Block
```
Use proto_blocks_generate with:
- name: "feature-card"
- title: "Feature Card"
- description: "A card with image, title, description, and link button"
```

## What is Proto-Blocks?

Proto-Blocks is a WordPress plugin that enables developers to create Gutenberg blocks using **PHP/HTML templates** instead of React. Key features:

- **PHP-First Development** - Write blocks in familiar PHP
- **Single Source of Truth** - Everything in `block.json`
- **Optional Tailwind CSS** - Built-in Tailwind support
- **WordPress Interactivity API** - Full support for reactive UIs
- **Template Caching** - Optimized performance

## Resources

- [Proto-Blocks Documentation](https://github.com/GustavoGomez092/proto-blocks)
- [MCP Server Repository](https://github.com/GustavoGomez092/zenblocks-mcp)

## License

MIT