Telex：WordPress官方出品一键生成现代 WordPress 主题

Telex 是由 WordPress 母公司 Automattic 开发的一款实验性 AI 编程开发工具，专门用于辅助开发者和建站用户生成自定义的 Gutenberg（古腾堡）区块。用户只需输入日常自然语言提示词，描述所需的区块结构、样式设计和交互行为，Telex 便会利用大语言模型在数十秒内自动编写代码，生成完全可运行的 WordPress 区块组件。

该工具深度集成了基于 WebAssembly 的 WordPress Playground 无服务器沙盒环境，代码生成后，用户无需部署任何本地开发环境，即可直接在浏览器中进行前端效果预览和编辑器后台测试。Telex 提供持续对话迭代功能，用户可通过 AI 助手对代码进行多轮微调。最终定稿的区块支持一键打包导出为标准的 .zip 格式插件文件，可无缝安装到任何自托管的活体 WordPress 网站中直接调用，大幅降低了功能模块的开发门槛。

功能列表

• 自然语言代码生成：支持使用普通文本提示词（Prompt），描述所需组件的逻辑与外观，AI 即可将其转化为原生的 WordPress Gutenberg 区块代码。
• 内置 Playground 沙盒预览：底层无缝集成 WordPress Playground，在浏览器端虚拟化运行 WordPress 环境，支持实时查看区块在网页前端的渲染效果及后台参数设置面板的运行状态。
• 对话式持续迭代：提供侧边栏 AI 助手，用户可以对初版生成的区块发出具体的修改指令（如更改颜色、调整间距、增加新交互），AI 会自动理解上下文并仅更新变动的代码。
• 一键打包导出插件：支持将调试完毕的区块连同依赖代码（React/JSX、CSS、PHP、block.json 等）一键打包下载为标准的 WordPress 插件压缩包（.zip）。
• 原生兼容性架构：专为 WordPress 生态量身定制，生成的代码完全遵循官方区块编辑器的开发规范与最佳实践，保障在各类主题下的兼容性。
• 代码可视化与审查：不仅提供图形化预览，还允许具备技术背景的开发者直接查看 AI 编写的底层源代码，确保逻辑透明，并便于后期二次手动开发。
• 视觉参考图解析（逐步开放）：支持用户上传界面截图或线框图等视觉素材，结合提示词指导大模型更精准地还原设计稿排版。

使用帮助

欢迎使用 Telex！这款由 Automattic 打造的 AI 编程平台能够将您的文本构想直接转化为功能完备的 WordPress 原生区块。为了让您能够充分发挥该平台的生产力，以下为您准备了极其详尽的操作指南。

特别提示：由于 Telex 当前处于实验阶段（Experimental），为了提供完整的代码生成、沙盒渲染和界面交互体验，系统目前强制要求在桌面端（台式电脑或笔记本）的浏览器中运行，使用手机或平板等移动端设备访问将无法加载主工作区。

一、 账号注册与工作区访问

1. 访问平台：打开您的桌面端现代浏览器（推荐使用 Google Chrome 或 Microsoft Edge，以保证 WebAssembly 容器的最佳性能），访问官方网址 https://telex.automattic.ai/。
2. 账号登录授权：在首页点击“Sign In”登录按钮。Telex 依托于官方生态，主要使用 WordPress.com 账号体系进行单点登录（SSO）。如果您已有账号则直接点击授权；若无账号，请使用电子邮箱免费注册一个基础账号。
3. 进入控制台：登录成功后，您会看到一个极简的提示词对话窗口，界面类似于常见的 AI 聊天机器人，这里即是代码生成的起点。

二、 核心操作流程：从提示词到可用插件

步骤 1：撰写高质量的结构化提示词（Prompt）

代码生成的精准度完全取决于您输入的指令细节。不要只给出模糊的词汇，建议按照“功能定义+后台配置+视觉样式+交互效果”的结构来撰写。

• 需求示例：您想做一个“团队成员介绍”区块。
• 推荐提示词写法：“请帮我生成一个‘团队成员展示’的 Gutenberg 区块。支持一行显示三个成员。后台配置：允许我在 WordPress 编辑器中分别上传每个人的头像、填写姓名、职位以及一句话简介。视觉样式：采用极简风格，头像设计为正圆形且带有浅灰色阴影。交互效果：当鼠标悬停在某个成员卡片上时，卡片需要有向上浮动 5px 的微小动画，并显示其 LinkedIn 和 Twitter 的图标链接。”
• 提交：确认描述无误后，按下回车键或点击发送图标，启动生成引擎。

步骤 2：代码自动编写与沙盒双视角验证

• 可视化生成：指令发送后，系统会展示代码生成的进度指示器，您能直观地看到 AI 生成的文件结构和代码行数，通常需要 30 秒至 1 分钟左右的计算时间。
• WordPress Playground 加载：代码编写完毕后，Telex 会在浏览器内存中瞬间启动一个无服务器的 WordPress 沙盒。无需购买服务器或配置数据库，即可直接进行测试。
• 双视角无缝切换：
  • 编辑器视图（Editor）：这是默认视图，模拟 WordPress 后台的编辑界面。您可以在这里选中刚刚生成的区块，测试右侧属性面板是否成功生成了您可以修改的输入框（如替换图片、修改文字）。
  • 前端视图（Frontend）：点击界面上的“Frontend”按钮，切换到访客视角，检验该区块在正式网页上的视觉排版是否合理，以及鼠标悬停等 CSS 动画是否正常触发。

步骤 3：与 AI 助手对话进行局部迭代

AI 生成的初版通常需要细节上的微调。无需从头开始，Telex 提供了状态记忆功能。

• 呼出助手（Assistant）：在界面的右侧面板，点击“Assistant”标签，进入针对当前区块的持续对话模式。
• 发送修改指令：直接用大白话指出问题。例如：“将成员卡片的阴影调深一点”、“把每行三个成员改成每行四个”，或者“在整个区块顶部增加一个居中的‘我们的核心团队’的主标题输入框”。
• 自动应用更新：AI 会读取之前的代码基础，仅针对您的要求重新编写变动部分的代码。完成后沙盒将自动刷新，展现修改后的最新效果。

步骤 4：一键打包导出与生产环境部署

一旦在沙盒中将区块调试到完美状态，即可将其移植到您实际运营的网站上。

1. 导出 ZIP 包：点击界面右上方的“Download”或“Export”按钮。系统会自动将包括 block.json 注册文件、index.js（React 逻辑）、style.css（样式表）及 index.php 在内的所有依赖文件压缩为一个标准的 WordPress 插件 ZIP 包。
2. 上传至个人网站：登录您活体 WordPress 网站的后台管理系统。
3. 安装启用：导航至左侧菜单 插件 -> 安装插件 -> 上传插件，选择刚才下载的 ZIP 文件。点击“现在安装”，随后点击“启用插件”。
4. 实际调用：进入任意文章或页面的区块编辑器，点击“+”号添加模块，在搜索框中搜索该区块名称，即可将其拖拽到页面中使用。

三、 进阶使用技巧与防坑指南

• 代码审查模式：如果您本身是开发人员，可点击代码标签（Code View）查看底层源码。若 AI 在实现复杂逻辑（如外部 API 数据请求）时出现报错，您可以在对话框中直接用开发术语指导它（例如：“请改用 useEffect 钩子处理数据拉取，并增加 try-catch 错误捕获机制”）。
• 拥抱模块化原则：Telex 专门用于生成独立的“功能区块”，而非完整的“整站主题”。建议将大型项目拆解为多个单一功能的区块（如：定价表区块、常见问题手风琴区块、动态倒计时区块），分别生成后再到 WordPress 中组合，这样生成的成功率和代码质量最高。
• 应对生成失败：作为实验性工具，偶发性的渲染失败属于正常现象。如果沙盒持续报错，建议点击重新生成（Regenerate），或者在提示词中简化功能需求，剔除过于复杂的第三方库依赖。

应用场景

1. 快速原型设计与视觉演示
   网页设计师或产品经理在构思新的页面交互时，无需等待前端工程师介入，直接使用 Telex 将文字构想转化为可操作的页面组件，在会议中快速向团队或客户展示实际运行效果。
2. 定制化营销活动组件开发
   电商与运营团队需要为特定节日大促开发专属网页元素（如带有特定视觉风格的倒计时牌、动态促销价格表）。利用 Telex 可在几分钟内生成专属区块插件，省去采购商业插件的成本和时间。
3. 辅助 WordPress 开发者提升效率
   专业的 WordPress 插件开发者可将 Telex 作为代码副驾驶（Copilot）。让 AI 负责繁琐的 Gutenberg 基础文件注册、React 脚手架搭建和基础 CSS 编写，开发者下载源码后专注于核心业务逻辑的二次开发，极大缩短开发周期。
4. 无代码建站者的功能边界拓展
   对于不具备编程背景的自建站用户，当现有主题或第三方页面构建器无法满足某种特定长尾功能时，可以通过 Telex 用自然语言“定制”专属组件，打破无代码工具的功能局限。

QA

1. Telex 是收费工具吗？
   答：目前，Telex 作为 Automattic 旗下的实验性项目，对所有登录用户完全免费开放，且暂无使用次数限制。由于底层消耗了大量的 AI 算力模型资源，未来转正后可能会推出相关的订阅或收费计划。
2. 我生成的区块可以直接安装在任何 WordPress 网站上吗？
   答：可以。只要您的网站是支持安装插件的自托管 WordPress（WordPress.org）环境，或者支持高级插件的托管计划，就可以直接将 Telex 导出的 .zip 文件作为常规插件上传并启用。
3. Telex 可以帮我生成一整个完整的 WordPress 主题吗？
   答：不可以。Telex 的架构和设计初衷完全聚焦于生成“Gutenberg 区块（Blocks）”。它擅长处理单一或组合性的页面组件，而不负责生成涉及全局页面路由、数据库底层结构或全站文件层级的“主题（Themes）”。
4. 为什么我在手机浏览器上打不开 Telex 的操作界面？
   答：为了保证复杂的代码生成过程、双重视角代码编辑器以及内置 WordPress Playground 沙盒的稳定运行和排版需求，官方强制限制了访问设备。请务必使用桌面端电脑的浏览器进行操作。
5. 如果生成的区块有 Bug 或者功能不符合预期怎么办？
   答：您无需懂代码也可修复。请在界面右侧打开 AI 助手（Assistant）面板，用大白话向 AI 描述错误现象或不满意的地方，AI 会自动排查并修改代码，随后在沙盒中为您展示修正后的版本。如果您懂代码，也可以直接切换到代码视图进行审查，然后用专业术语指导 AI 修复。