Telex 是 Automattic 推出的一款实验性、基于浏览器的免费工具,可使用 AI 根据自然语言提示生成 WordPress 块。
无需设置本地开发环境、配置构建工具以及手动搭建块结构,Telex 让你只需描述需求、预览结果,然后下载即可安装的插件。
本文探讨了这种工作流程的实际运作方式,以及它目前真正适合用于哪些类型的块。我们将使用两个真实示例(包括一个更复杂的仅编辑器块),看看 Telex 能带你走多远,以及在哪些情况下仍需要手动干预。

Telex 的实际运作方式
Telex 采用流水线式的工作流程。你用自然语言描述想要的块,然后 Telex 将该请求映射到基于标准 create-block 工具的预定义 WordPress 块结构上。

在此基础上,AI 会填充详细信息,如块元数据、编辑器 UI、渲染逻辑以及在这些约束内的基本样式。然后,块会在托管的 Node.js 环境中构建,在 WordPress Playground 中预览,并打包成可上传的 ZIP 插件。
在后台,生成的插件遵循熟悉的结构,与 create-block 高度一致:
block-name/
├── build/
├── src/
│ ├── edit.js
│ ├── save.js
│ ├── index.js
│ ├── style.scss
│ └── editor.scss
├── block.json
├── package.json
├── readme.md
└── .gitignore
让我们构建两个块中的第一个。
氛围编程一个嵌入 ChatGPT 块
你可能还记得过去常见的情况——网页上嵌入了一个 Google 搜索框,允许用户搜索网站或整个网络。如果你需要为用户提供这种体验,但这次是使用 ChatGPT 输入,可以按以下方法操作。
这是一个很好的起点,因为你可以专注于熟悉 Telex 的 UI,而不必过于担心提示词的优化或多次迭代。
以使用 wordPress.com 凭据的登录用户身份开始,然后你可以描述你的初始提示。以下是我们使用的:
我们希望创建一个块,用于嵌入 ChatGPT 提示,允许用户在前端使用它。
请参见下方的 UI:

Telex 创建了 ChatGPT 嵌入块,其中包括提示输入框、消息历史显示,以及与 ChatGPT 审美相符的样式。
此时,块在编辑器 UI 中输出一条错误消息。

我们请求 Telex 解决这个问题,并在引导下生成了 ChatGPT API 密钥并通过 Inspector 侧边栏将其添加到块中。在我们看来,使用外部 API 不会带来不必要的安全风险。

最后,我们在前端进行了快速测试,以确认一切按预期工作。

Vibe coding一个社交草稿块
对于我们的第二个例子,让我们通过构建一个内部块来进一步开发Telex,用于起草社交媒体帖子(一个允许内容编写、审核和导出以进行排期的功能,无需使用单独的协作工具或付费团队计划)。
我们可以从以下设置提示开始:
Build a custom WordPress block named 'Social Draft'. We will give you further instructions after you set up.
通常最好先使用另一个AI工具(如ChatGPT)来制定一套完整的需求,而不是用大量指令让Telex过载。这包括定义你的目标、前端应该是什么样子、数据如何存储、用户如何与系统交互等等。以下是ChatGPT返回的内容摘要:
目标
构建一个仅在编辑器中使用的WordPress块,作为起草社交媒体帖子的内部内容准备工具,类似于轻量级的Google Docs工作流程。该块应支持文本、链接、图片和视频嵌入,以及平台选择、备选版本的文案、帖子状态、备注和一个导出面板,用于将内容复制到社交发布平台。
该块不得在前端渲染任何内容。它应仅用于编辑器工作流程,save()返回null。
编辑器UI
主草稿区域("Copy")应使用InnerBlocks而不是单个RichText字段实现,允许段落、图片、嵌入和列表。应提供一个选项来添加两个备选版本的文案,每个版本都具有与主草稿相同的灵活性。简单的单次复制控件应允许内容在部分之间复制。
其他控件包括通过复选框选择平台、单个状态字段(Draft、Ready for review、Scheduled或Not used)以及纯文本备注字段。
导出面板应从选定的草稿或备选中提取纯文本,忽略媒体,并提供一键复制结果的方式。检测到的媒体(图片和嵌入)可以列出供参考,但不会包含在复制的输出中。
所有数据应使用属性和InnerBlocks存储在块内。无需外部API。
当我们将其提供给Telex时,得到了预期的UI,但社交草稿块无法在内容区域中显示。

在vibe coding中,很多情况下你需要经历多次迭代,这就是其中之一。
Telex识别出了与InnerBlocks初始化相关的问题,并尝试重构块以解决渲染问题。这些早期尝试并没有成功,该块仍然无法在编辑器中正确显示。
在这一点上,我们询问Telex它是否能处理我们的请求,因为我们正在失去信心。我们重申所有UI都已暴露,除了我们需要的(添加和显示块的能力)。
Telex回复道:
I completely understand your frustration, and yes, I can absolutely do this.I can see the problem - the useBlockProps is being applied but the block isn't rendering visible content in the canvas. The issue is that while we have all the controls and structure, the block wrapper isn't being properly rendered as a visible container. Let me fix this by ensuring the block has proper structure and visibility.
我们终于得到了UI并开始快速测试。

经过多次其他改进后,我们最终实现了一个可用的区块,完成了我们的MVP。

缺点和解决方案
Telex在短时间内取得了长足的进步,但一旦你开始将其用于简单的实验以外的应用,一些限制就变得很明显。这些限制大多数都不会阻止你使用,但它们确实会影响Telex的最佳使用方式和时机。
- Telex在你提交提示后会立即(重新)生成区块,无法撤销或恢复之前的版本。要避免不需要的操作,请在构建、重试或类似命令之前,向Telex询问"你会如何做…"来预览你的提示。
- Telex最适合用于头脑风暴和原型设计。对于生产环境使用,最安全的方式是将其限制在非常简单的区块上,这些区块不涉及外部集成、复杂逻辑或对安全和性能敏感的问题。
用AI构建区块的未来
Telex让我们得以一窥AI如何融入现代WordPress开发。它降低了实验的成本,缩短了想法与原型之间的距离,并使区块脚手架的搭建更加容易。
同时,这里的例子表明,理解区块编辑器仍然很重要。
一旦一个区块准备好超越实验阶段,拥有一个可靠的WordPress环境(如Kinsta)会让你更有信心地进行测试、迭代和发布。




