砖块MCP
人工智能助手 砖块建造者.通过兼容MCP的人工智能工具(如Claude)用自然语言控制您的网站。
访问您的网站。它在听。
它的作用
Bricks MCP是一个WordPress插件,它实现了 MCP(模型上下文协议) 服务器,让AI助手读写你的Bricks Builder网站。连接Claude Code、Claude Desktop、Cursor或任何兼容的MCP客户端,并通过自然语言管理页面、模板、全局类、主题样式、WooCommerce布局等。
特性
- 11个涵盖完整Bricks Builder数据模型的规范MCP工具
- 读写页面、模板、元素和全局设置
- WooCommerce支持(产品页面、购物车、结账、帐户模板)
- 全局类、主题样式、排版比例、调色板、变量
- 集成Unsplash的媒体库管理
- WordPress菜单、字体和自定义代码管理
- 内置连接测试器和配置片段生成器
- 适用于Claude Code、Claude Desktop、Cursor和其他兼容的MCP客户端
需求
- WordPress 6.4+
- PHP 8.2+
- 砖块建造者1.6+
安装
无需作曲家。该插件附带了自己的PSR-4自动加载器(includes/Autoloader.php)这张地图 BricksMCP\ 命名空间到 includes/ 目录。只需上传并激活即可,无需构建步骤。
- 从下载最新版本
- 通过插件>添加新插件>上传插件上传到您的WordPress网站
- 激活插件
- 前往“设置”>“Bricks MCP”进行配置
本地WP/手动服务器设置
如果运行LocalWP或自定义服务器堆栈,PHP和Nginx可能需要更改配置以实现稳定的MCP连接(SSE流需要更长的超时和无缓冲响应)。请参阅 本地WP设置指南 获取分步说明。
连接您的AI工具
克劳德代码
claude mcp add bricks-mcp https://yoursite.com/wp-json/bricks-mcp/v1/mcp --transport http克劳德桌面/光标/其他MCP客户端
添加到MCP配置(.mcp.json 或同等):
{
"mcpServers": {
"bricks-mcp": {
"type": "http",
"url": "https://yoursite.com/wp-json/bricks-mcp/v1/mcp",
"headers": {
"Authorization": "Basic BASE64_ENCODED_CREDENTIALS"
}
}
}
}身份验证使用WordPress 应用程序密码 (用户>个人资料>应用程序密码)。
ChatGPT目前不支持作为此插件的MCP客户端。ChatGPT的MCP流程需要OAuth 2.1和动态客户端注册,而Bricks MCP使用WordPress应用程序密码进行身份验证。
可用工具
| 工具 | 说明 |
|---|---|
get_site_info | 阅读WordPress网站详细信息并运行连接诊断 |
get_builder_guide | 在编辑内容之前,请阅读Bricks builder指南 |
bricks | 管理砖生成器设置、模式、查询和引用 |
content | 跨帖子、页面和元素管理WordPress和Bricks内容 |
template | 管理Bricks模板、条件和模板分类 |
design | 跨类、样式、调色板、变量和字体管理Bricks设计标记 |
media | 上传媒体、搜索Unsplash、管理库 |
menu | WordPress菜单管理 |
component | 砖块组件(可重复使用的元素)管理 |
woocommerce | WooCommerce页面模板和产品布局 |
code | 页面级CSS和JavaScript |
试试看
连接后,使用您的AI工具尝试这些提示。每个人都使用不同的MCP工具,可用于验证集成是否正常工作。
基本检查
What WordPress site am I connected to? What version is it running?List all active plugins on this site.Show me the Bricks Builder guide so I understand how to build pages.页面构建
Create a new page called "About Us" with a hero section containing a heading
"About Our Company" and a paragraph of placeholder text below it.Add a two-column container to the About Us page. Put a heading and text in the
left column, and an image placeholder in the right column.List all my pages and show which ones use Bricks Builder.全局样式
Create a global class called "btn-primary" with 12px 24px padding, white text,
#2563eb background, 6px border radius, and 600 font weight.Create a color palette called "Brand Colors" with: Primary #2563eb, Secondary
#7c3aed, Accent #f59e0b, and Neutral #64748b.Create a theme style that sets all H1 headings to 48px bold and H2 to 36px
semibold.模板
Create a section template called "CTA Banner" with a dark background section
containing a centered heading and a button.List all my templates and their types.菜单
Create a navigation menu called "Main Menu" with links to Home (/), About
(/about/), Services (/services/), and Contact (/contact/).高级
Show me the Bricks settings and breakpoints configured on this site.Create a typography scale with steps: xs 12px, sm 14px, base 16px, lg 20px,
xl 24px, 2xl 32px, 3xl 48px. Use the prefix --fs-.Create a set of global CSS variables for spacing: --space-xs 4px, --space-sm
8px, --space-md 16px, --space-lg 32px, --space-xl 64px.配置
首选 设置>砖块MCP 在WordPress管理中:
- 启用MCP服务器 --打开/关闭服务器
- 需要认证 --限制经过身份验证的用户访问
- 自定义基本URL --用于反向代理或自定义域
- 危险行为 --启用对全局Bricks设置和代码执行的写访问权限
延伸
使用添加自定义工具 bricks_mcp_tools 筛选器:
add_filter( 'bricks_mcp_tools', function( $tools ) {
$tools['my_custom_tool'] = [
'name' => 'my_custom_tool',
'description' => 'My custom tool description',
'inputSchema' => [
'type' => 'object',
'properties' => [],
],
'handler' => function( $args ) {
return ['result' => 'success'];
},
];
return $tools;
});本地开发
先决条件: 码头工人 和 18+.
git clone https://github.com/cristianuibar/bricks-mcp.git
cd bricks-mcp
npm install
npm run start就是这样。第一次启动需要几分钟的时间来下载WordPress并设置容器。Composer依赖项会自动安装在容器内。
本地站点:http://localhost:8888(管理员/密码)
可用命令
npm run start # Start WordPress environment (Docker via wp-env)
npm run stop # Stop the environment
npm run test # Run all PHPUnit tests
npm run test:unit # Run unit tests only
npm run lint # WordPress coding standards check
npm run lint:fix # Auto-fix linting issues
npm run wp # Run WP-CLI commands
npm run logs:watch # Tail the PHP debug log运作原理
开发环境使用 @wordpress/环境 (wp-env),它在Docker容器中运行WordPress。插件目录直接挂载到容器中,因此文件更改会立即反映出来。
A. mu插件 包括修复Docker网络漏洞(REST API环回和HTTP上的应用程序密码)。
许可证
GPL-2.0或更高版本
