TinyMCE 8 是一个功能强大且灵活的富文本编辑器，可嵌入到 Web 应用程序中。本快速入门指南介绍如何通过安装官方的 TinyMCE agent skill 并让 AI 编码代理执行设置，从而将 TinyMCE 编辑器添加到应用程序中。

如需不使用 AI 编码代理的等效逐步设置说明，请参阅 Tiny Cloud 快速入门指南。

安装 TinyMCE skill

官方 TinyMCE skill 教导 AI 编码代理如何将 TinyMCE 添加到项目中。从项目目录中，使用单条命令将其安装到代理（Claude Code、Codex、Cursor、GitHub Copilot 等）中：

npx skills add tinymce/tinymce-ai-skills

安装程序会下载该 skill，检测项目中存在的代理，并将该 skill 写入每个代理。无需预先克隆仓库。该 skill 采用开放的 Agent Skills 格式，因此可在支持该格式的任意代理中使用。

安装完成后，每当代理被要求安装、设置、配置或排查 TinyMCE 问题时，该 skill 会自动加载。无需额外的提示。

若要通过非命令行界面进行安装，请按照 tinymce-ai-skills README 中手动安装部分下的各代理特定说明操作。如果发现 skill 中的指导有误、过时或缺失，请在同一仓库中 提交问题 进行反馈。

将 TinyMCE 添加到应用程序

在需要富文本编辑器的地方请求代理添加 TinyMCE，例如：

在我的帖子页面的评论框中添加一个 TinyMCE 编辑器。

该 skill 引导代理完成整个设置过程：

  • 检测运行环境，无论是原生 JavaScript 还是框架（如 React、Next.js、Vue 或 Angular）。

  • 提示提供提供 API 密钥的 Tiny Cloud 账户。通过注册 Tiny Cloud 即可创建账户，该账户还提供 Premium Plugins 的试用。

  • 选择适合用例的插件、工具栏和菜单。

  • 生成集成代码，接入 API 密钥，并设置所选插件所需的选项。

最终结果是为当前项目配置的编辑器，而非需要后续调整的通用配置。

批准应用程序域名

任何非源自 localhost 的应用程序都需要将其域名添加到与 API 密钥关联的已批准域名列表中。在域名获得批准之前，编辑器会显示通知“此域名未在 Tiny Cloud 注册。请参阅快速入门指南或创建账户。”要移除该通知，请将域名添加到 Tiny Account 中的已批准域名列表。

在 localhost 上进行本地开发时无需此步骤，因此可以推迟到应用程序部署或从自定义主机提供服务时再执行。如果通知持续存在，有关诊断步骤请参阅 域名未注册。

使用实时文档进行进一步配置

通过添加插件、定制工具栏和菜单，或根据当前 API 细化行为来深入配置，当代理读取发布的文档而不是依赖其训练数据时会更可靠。以下章节涵盖主要选项；对于所有四个选项（包括各代理的配置文件），请参阅 将 AI 代理连接到文档。

连接以下其中一个 Model Context Protocol (MCP) 服务器：

服务器描述

TinyMCE 文档 MCP

对已发布的 TinyMCE 文档进行语义搜索，返回包含指向源页面链接的相关摘录。对于各代理的配置文件，请参阅 连接 TinyMCE 文档 MCP 服务器。

Context7

一个通用的文档 MCP 服务器。将其指向 /tinymce/tinymce-docs 库，以便向代理提供特定版本的 TinyMCE 文档。该 skill 在生成代码前会检查 Context7，因此当两者都可用时，它会使用该服务器。有关设置步骤，请参阅 连接 Context7。

要连接 TinyMCE 文档 MCP 服务器，请将代理的 MCP 客户端指向以下端点并完成一次性 OAuth 登录：

https://tinymcedocs.mcp.kapa.ai

支持的编辑器的复制剪贴板安装命令和一键安装也可在任何文档页面的Ask AI小部件下的Use MCP区域获取。

连接服务器后，向代理提出所需更改，它将使用当前指导应用该更改，例如：

添加 Table 和 Word Count 插件，并在状态栏中放置一个字数计数器。

不支持 MCP 的代理可以将文档作为 markdown 读取，或从 llms.txt 文件读取。请参阅 将文档作为 markdown 读取 和 llms.txt 文件。

下一步

关于以下内容的信息：