Proto-Blocks

The Proto-Blocks MCP Server gives you a ready-to-use gateway for building WordPress Gutenberg blocks using PHP templates. It streamlines access to focused guidance, examples, and a block generator that runs without a build step, helping you design and implement blocks efficiently.

How to use

You connect to the Proto-Blocks MCP Server from your MCP client to access specialized tools and guided workflows. Use the HTTP method if you need a remote server, or run the local STDIO server for development and testing. In both cases you will interact with a set of utilities that cover getting started, documentation, examples, troubleshooting, block generation, and advanced topics like repeaters and interactivity. Follow practical prompts to generate blocks from descriptions, view field and control types, and iterate on templates and styling.

How to install

Prerequisites: you need Node.js and npm installed on your machine. You may also use a MCP client that supports both HTTP and STDIO MCP servers.

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

To run a local development instance of the MCP server, execute the following commands in your project directory where the MCP server is located:

cd mcp
npm install
node index.js

Additional notes

If you prefer running the server through a one-off command, you can deploy via npx with the exact configuration shown above. The local development route uses Node.js to start the server directly from the index script, so you can iterate on code and templates without a separate build step.

Available tools

proto_blocks_get_started

Comprehensive introduction to Proto-Blocks and how to begin building blocks using PHP templates.

proto_blocks_quick_reference

A quick cheat sheet for common patterns across field types, controls, and block structure.

proto_blocks_field_types

Detailed documentation of field types such as text, wysiwyg, image, link, repeater, and innerblocks.

proto_blocks_control_types

Documentation of control types including text, select, toggle, range, color, and more.

proto_blocks_templates

PHP template patterns and best practices for block templates.

proto_blocks_styling

Styling approaches using Vanilla CSS or Tailwind CSS in Proto-Blocks.

proto_blocks_interactivity

Frontend interactivity options including plain JS, ES modules, and WordPress Interactivity API.

proto_blocks_schema

Complete block.json schema reference for block configuration.

proto_blocks_examples

Working examples across basic to expert levels to illustrate block usage.

proto_blocks_troubleshooting

Solutions for common issues encountered while building Proto-Blocks.

proto_blocks_repeaters

Comprehensive guidance on using repeaters, including nested and Interactivity API integration.

proto_blocks_generate

Generate complete blocks from a description using the block generator.