我把「发布博客」这件事做成了 WorkBuddy Skill

WorkBuddy 的 Skill 系统可以让我把重复的工作流固化下来，下次直接复用。今天我就把这个「发布 WordPress 文章」的流程本身变成了一篇文章发布到 WordPress —— 套娃感拉满。

1. 这是什么 Skill？

wordpress-blog-editor 是一个 WorkBuddy Skill，它让 AI 代理能够直接通过 Chrome DevTools Protocol 操作 WordPress 的 Gutenberg 编辑器。

简单说：我现在对 AI 说”帮我把这篇文章发到博客”，它会自己打开 WordPress 后台，填入标题、插入内容、设置 Slug，然后点击发布。

2. 为什么需要这个 Skill？

以前写技术博客的流程是这样的：

在本地写好 Markdown
打开 WordPress 新建文章
复制粘贴标题
把 Markdown 转成 Gutenberg 块
调整格式、加代码块
设置标签和分类
预览、修改、发布

整个过程大概 10-15 分钟。但如果我用 AI 写完内容后，再让 AI 自己把它发到博客上，那就变成了 1 分钟。

这个 Skill 要解决的核心问题就是：让内容生产和发布直接打通。

3. 技术原理

3.1 浏览器自动化层

通过 browser-harness 连接到 Chrome，利用 Chrome DevTools Protocol (CDP) 远程控制浏览器。

用户只需要手动打开 Chrome 并授权远程调试（chrome://inspect/#remote-debugging），之后的所有操作都由 AI 自动完成。

3.2 WordPress Block Editor API

WordPress 后台运行在 React 之上，暴露了 wp.data 这个全局状态管理 API。通过它可以直接操作编辑器：

wp.data.select('core/block-editor').getBlocks() — 获取所有块
wp.blocks.rawHandler({ HTML: html }) — 将 HTML 转换为 Gutenberg 块
wp.data.dispatch('core/block-editor').insertBlocks() — 插入块
wp.data.dispatch('core/block-editor').removeBlocks() — 删除块
wp.data.dispatch('core/editor').savePost() — 保存
wp.data.dispatch('core/editor').editPost() — 编辑标题/Slug 等元数据

3.3 内容转换

用标准 Gutenberg HTML 注释格式写内容，rawHandler 会自动解析成正确的块类型：

<!-- wp:heading --><h2>标题</h2><!-- /wp:heading -->
<!-- wp:paragraph --><p>段落</p><!-- /wp:paragraph -->
<!-- wp:code --><pre class="wp-block-code"><code>代码</code></pre><!-- /wp:code -->
<!-- wp:table --><figure class="wp-block-table"><table>...</table></figure><!-- /wp:table -->

实际操作中有一个坑：HTML 内容中的反斜杠和引号会被 Python/Shell 转义吃掉。解决方案是用 json.dumps() 双重转义，确保内容安全传到浏览器。

4. Skill 的核心功能

模式 A：替换全部内容

清空编辑器所有块，插入全新的文章内容。适合从零开始写一篇文章。

模式 B：替换特定章节

通过标题内容定位章节边界（比如找到”7. 如何开始使用”到”8. 最后”之间的所有块），删除后插入新内容。适合修改已有文章的某个部分。

模式 C：设置元数据

修改标题、Slug（URL 别名），然后保存。Slug 的更新需要显式调用 editPost() + savePost()。

模式 D：发布

模拟点击发布按钮，处理确认弹窗，最后验证文章状态是否为 publish。

5. 实际操作中的几个坑

HTML 转义：反斜杠是最大的坑。Windows 路径 scripts\build_exe.bat 中的 \b 会被 Python 解释为退格符，必须用 raw string 或转义
异步等待：删除块后编辑器需要时间更新状态，直接插入会导致位置错乱。加 500ms 延迟解决
Slug 更新：发布后的文章 slug 仍然可以通过 editPost() 修改，但要记得调用 savePost()
标签页管理：Chrome 可能有多个标签页，需要用 list_tabs() 找到正确的编辑页面再操作
发布流程：点击发布按钮可能需要两次（第一次打开发布面板，第二次确认发布），用 wait() 处理好时序

6. 总结

这个 wordpress-blog-editor Skill 把”让 AI 写文章”升级成了”让 AI 写文章并自己发布”。每次写完内容后说一句”帮我把这个发到博客”，剩下的事情 AI 自己搞定。

这也是 WorkBuddy Skill 系统的魅力所在——你先做一遍，AI 学会了，下次它自己来。 不光是发博客，任何重复性的浏览器操作都可以做成 Skill。

这篇博客本身就是用这个 Skill 发布的——算是绕了一圈回到了原点，但这个过程本身挺有意思的。

如果你也在用 WorkBuddy，不妨试试把日常操作做成 Skill，你会发现重复性工作会越来越少。