很多人问我：你的排版怎么做的？能不能分享一下？

今天把我的 AI 写作系统完整分享给大家。

给个主题思路，直接出完整文章——排版、配图、风格，全部自动搞定。

如下图

AI配图说明：正在开发 Nano Banana Pro MCP 中，直接 AI 生图

解决了什么问题

1.一图说清复杂逻辑

用 AI 梳理文章里的复杂逻辑，自动生成好理解的配图。

比如

原文：发布内容 -> 看数据 -> 分析原因 -> 更新方法 -> 发布内容

这种表达，可以做成下面更好可视化的内容

2.AI编程，个性化排版

每个图片，附上我的头像以及图片名称

更有活人感

3.一键整理，自动出稿

按我定好的写作提示词，AI 直接整理成完整文档。

整体流程

看懂流程了吗？
我写的不清楚的地方，欢迎在评论区留言。

接下来手把手教你配置。

用到什么工具

必需：

• Obsidian — 写作编辑器，免费

• PicGo — 图床工具，让图片有固定网址

• AI 编程工具 — Claude Code、Cursor、Windsurf、Trae 都行

可选：

• 提示词模板 — 让 AI 按你的规范写作

• Nano Banana Pro — AI 生成逻辑配图

具体教程

整个配置大概15分钟，跟着做就行。

配置分4步：
1.下载 Obsidian
2.安装插件
3.配置 PicGo 图床
4.启用插件并使用

第一步：下载软件

Obsidian — 写作编辑器

下载地址：https://obsidian.md

下载后，打开一个文件夹，当作写作管理的文件夹。

因为 Obsidian 里面的笔记，都是存在本地的。

打开以后就是类似这样的桌面

软件装好了，接下来2分钟安装插件。

第二步：安装插件

用 Claude Code（或其他 AI 编程工具），在你的 Obsidian 笔记库目录（就是第一步打开的那个文件夹）下运行，发这段提示词：

帮我安装 AI 写作插件：

1.克隆 https://github.com/Ceeon/ai-writing-plugins 到临时目录
2.确保当前目录有 .obsidian/plugins/ 文件夹（没有就创建）
3.把 obsidian-apple-style 和 obsidian-image-uploader 复制到 .obsidian/plugins/
4.告诉我怎么配置 PicGo 的 GitHub 图床
5.告诉我怎么启用插件

插件说明：

• obsidian-apple-style — 排版插件，一键转公众号格式

• obsidian-image-uploader — 图片上传插件，粘贴图片自动上传到图床

用其他 AI 编程工具？

Cursor、Windsurf、Trae 等带 IDE 的工具也能用：
1.用 Obsidian 打开笔记库目录
2.用你的 AI 工具打开同一个目录
3.把上面的提示词发给 AI，一样能安装插件

核心是让 AI 能访问 .obsidian/plugins/ 文件夹就行。

插件安装好后，接下来配置 PicGo 图床。

第三步：配置 PicGo

图床就是让图片有固定网址，公众号才能显示。

这一步最长，但后面只要点几下就行。

下载 PicGo

下载地址：https://molunerfinn.com/PicGo

PicGo 打开是这样的：

配置 GitHub 图床

打开图床设置里面的 GitHub：

填写配置：

• 仓库名：你的用户名/图床仓库名（如 Chengfeng/pic）

• 分支：main（默认）

• Token：需要去 GitHub 获取

获取仓库名称

可以让 AI 登录你的 GitHub 账户，新建一个仓库，然后把仓库名发给你。

获取 GitHub Token

打开这个页面：https://github.com/settings/tokens

选择第二个按钮：

根据下图填写信息：

滑到底保存：

复制这个码：

保存到 PicGo 配置里：

到这里，图床就配置好了。

以后在 Obsidian 里粘贴图片，会自动上传到 GitHub。

最难的部分搞定了，最后一步启用插件就能用了。

第四步：启用插件并使用

启用插件

1.重启 Obsidian

2.设置 → 第三方插件 → 关闭安全模式

3.启用 obsidian-apple-style 和 obsidian-image-uploader

使用排版插件

文章写好以后，点击左边的这个按钮，就可以转换了：

点击复制 HTML：

就可以把内容粘贴到公众号里面去了：

到这里，基础配置就完成了。

写文章 → 一键排版 → 粘贴发布，整个流程跑通了。

想更进一步？

下面是两个进阶玩法，感兴趣可以继续看。

进阶一：让 AI 按你的规范写作

基础工作都弄好了，接下来可以用提示词让 AI 按你的写作结构规范写作。

把下面的内容直接发给 AI，就能按这个规范帮你写：

（想更进一步？可以把提示词保存成 Skills 文件，参考：Claude Skills 写作指南：从0到1看完就会，不会来找我）

# 写作结构规范

## Markdown 格式

1.**三级标题**：只用 H1/H2/H3，不用 H4/H5/H6
2.**句子换行**：用 `///`（除序号列表、一问一答等紧密关联内容外）
3.**有序列表**：数字后无空格（`1.项目` 不是 `1. 项目`）

## 换行符说明

`///` 是自定义换行符，插件会自动转换为 HTML 的 `<br>` 标签。

为什么不用 `---`？因为 Markdown 会把它解析成水平线 `<hr>`。

## 检查清单

- [ ] 只用 H1/H2/H3？
- [ ] 句子之间用 /// 换行？
- [ ] 有序列表无空格？

## 常见错误

❌ H4/H5/H6 → 改用 H3
❌ 用 --- 换行 → 改用 ///
❌ 1. 项目（有空格）→ 1.项目（无空格）

本地需要用 /// 来当做换行符号，因为普通的换行符号，格式转化会被忽略。

进阶二：用 Nano Banana Pro 生成逻辑图

Nano Banana Pro 参考上次发的白嫖方案：

白嫖一个月 gemini3 和 nano banana pro

遇到复杂逻辑，可以用 AI 生成配图。

步骤：

1.把逻辑写成文字或 ASCII，比如

┌─────────────────────────────────────────────────────┐
│                    写文章                            │
└─────────────────────┬───────────────────────────────┘
                      ↓
┌─────────────────────────────────────────────────────┐
│  Obsidian + 排版插件 → 一键转换 → 复制 HTML           │
└─────────────────────┬───────────────────────────────┘
                      ↓
┌─────────────────────────────────────────────────────┐
│              粘贴到公众号，发布                       │
└─────────────────────────────────────────────────────┘

2.粘贴到 Nano Banana Pro

3.提示词：插画风

效果： 如下图

进阶三：用 AI 定制头像和排版风格

排版插件的样式是可以改的。

不用懂代码，直接用 AI 对话修改。

修改头像

先把头像上传到图床，获取链接：

1.打开 PicGo
2.把你的头像拖进去上传
3.复制生成的图片链接

然后把下面的提示词发给 AI 编程工具：

帮我修改排版插件的头像：

1.打开 .obsidian/plugins/obsidian-apple-style/themes/apple-theme.js
2.找到头像图片的 URL
3.替换成我的新头像地址：[粘贴你的头像链接]

修改排版风格

想改颜色、字体、间距？直接告诉 AI：

帮我修改排版插件的样式：

1.打开 .obsidian/plugins/obsidian-apple-style/styles.css
2.我想要：
  - 标题颜色改成深蓝色
  - 正文字号改成 16px
  - 段落间距再大一点

AI 会帮你找到对应的代码，直接修改。

不满意？继续对话调整，直到满意为止。

这就是 AI 编程的好处——不用懂代码，用自然语言描述需求就行。