导语：AI 直接操作 WordPress 模板结构
Builderius 于 2026 年 2 月 21 日发布了一项实验性 AI 集成功能，通过 Model Context Protocol（MCP）将 Anthropic 的 Claude 连接到实时 WordPress 项目。这项集成允许 AI 读取 Builderius 模板的完整状态，并在可视化开发环境中直接应用结构变更，而非生成孤立的代码片段。 用户需使用自己的订阅或 API 凭证将 Claude 连接到 Builderius 安装（支持本地或远程 WordPress 站点）。连接后，AI 可读取当前模板的元素树、CSS 框架、数据变量、GraphQL 架构、断点设置以及当前选中的元素，并直接在构建器中应用修改。
核心架构：结构化控制的设计基础
Builderius 的可视化开发环境将模板存储为 JSON 格式，每个节点直接映射到 HTML 元素。构建器中可见的树结构与页面渲染的树结构完全一致。CSS 类、变量、元素设置和 GraphQL 架构均以结构化数据形式存在于项目中。 早期版本的 Builderius 使用外部 AI 技能文件，Claude 仅能参考文档而无法检查实际项目。新集成通过 MCP 消除了这一限制——AI 在编写代码或编辑元素前，会先读取实时模板状态，包括元素树、GraphQL 架构和已解析值的数据变量。这种设计让 AI 能够基于真实项目状态进行操作，而非仅依赖文档描述。
核心能力：画布编辑与 CSS 感知
该集成引入了多项直接操作实时画布的能力：
- 元素操作：AI 可直接添加、移动、复制、删除和配置元素
- CSS 智能处理：在写入新样式前读取项目中所有类、变量和规则，优先应用现有类；生成新 CSS 时将其放入可复用的模板级类中，而非内联样式
- 上下文感知：AI 能检测用户当前选中的元素，并在该元素内插入或编辑内容，无需手动描述上下文
官方表示，这一设计解决了构建大型结构时重复点击的问题，AI 会在写入新样式前先读取项目的 CSS 并优先应用现有类。
数据循环：架构验证的配置加速
动态数据循环是该集成最详细的功能之一。AI 的工作流程包括：
- 读取 WordPress GraphQL 架构
- 使用已验证的字段名编写查询
- 创建所需的数据变量
- 检查解析后的输出
- 使用正确的绑定语法构建循环结构
官方示例指出，类似”以网格形式展示我最新的 6 篇文章，包含缩略图、标题和摘要”这样的提示，可首次尝试即得到正确结果。公司表示，过去需要 1 至 2 小时查阅文档和调试的工作，现在可在 1 分钟内完成。
响应式与无障碍：创建时即合规
AI 能够读取已定义的断点并在正确的屏幕尺寸下应用布局变更。当用户要求将多列布局在移动端堆叠时，AI 会切换到相应断点并调整布局。 在无障碍功能方面：
- AI 使用语义化 HTML 元素（如 header、nav、main、article）
- 维护标题层级结构
- 在元素创建时设置 ARIA 属性
- 用户可请求运行 WCAG 2.2 审计，执行 12 项检查并返回 0 至 100 的评分
官方强调，无障碍功能在元素创建时即应用，而非作为单独步骤处理。
限制与边界：实验性发布的定义
Builderius 明确定义了该集成的能力边界：
- ❌ 不生成图像
- ❌ 不编写自定义 PHP 插件或 JavaScript 脚本
- ❌ 不部署站点
- ❌ 不自动保存变更（需用户确认）
- ✅ 在 Builderius 的元素系统和 GraphQL 层内工作
公司将此版本定义为实验性发布，并指出 AI 在行动前会读取完整项目状态，这提高了准确性，但也增加了简单编辑（如更改标题）的处理时间。
未来规划：组件化与上下文提示
Builderius 计划进一步扩展该集成：
- 可复用组件：支持创建带类型属性的组件
- 条件渲染：基于文章类型、登录状态、自定义字段或表达式进行条件渲染
- 上下文提示：从单一文本提示转向构建器面板内的上下文提示，例如在动态数据面板中放置查询辅助，或在选中元素附近放置编辑提示
此版本标志着首个公开版本，允许 AI 模型在结构层面读取和修改实时 WordPress 模板。
