如何用 obsidian 编写 MD 文档并发布到安知鱼主题博客

如何用 obsidian 编写 MD 文档并发布到安知鱼主题博客

资源准备

Download - Obsidian(下文均以 OB 作为 obsidian 的简称)支持 windows、安卓、ios、mac、linux 全平台,可通过插件实现全平台同步

OB 基础配置

配置资料库关联本地博客仓库

  • 本地博客仓库存放文章的路径:本地博客文件夹/source/_posts,其中的 .md 文件就是博客文章
  • 远程仓库存放文章的路径:远程仓库名/source/_posts,如果你是按照我 这篇文章 部署的源码库,则仓库名是 自定义 的;如果你是按照 cm 的教程部署到 github pages,则仓库名=你的用户名.github.io
  • 启动 OB 后会要求你在本地新建一个资料库,点击 新建,指向 本地博客文件夹/source/_posts 文件夹,这样就将 OB 与本地博客仓库关联起来了,OB 会在 _post 文件夹下自动创建一个 .obsidian 文件夹,用于存放 OB 的各种配置文件

image.png

记得顺带选择 “ 简体中文 “,若此时没选,也不要着急,按以下方式设置简体中文

设置中文界面

输入 ctrl+p,在命令栏输入 设置打开设置,点击 关于,调整界面语言为 中文

image.png

安装发布插件

  • 输入 ctrl+p,在命令栏输入 设置打开设置,依次点击 第三方插件——社区插件市场——浏览,出现插件市场的界面:

image.png

  • 搜索 Enveloppe,安装它,装完后显示的名称是 github publisher

配置发布插件

  • 首先设置 第一页:github config,注意下图我打红框的几个地方。设置好后点击 test connection,看看是否成功连通
1
2
3
4
github username = 你的github用户名
Repository name = 你的远程仓库名
github token = token必须具有repo权限
Main branch = 你仓库的分支名,一般是main或master

image.png

  • 设置 第二页:files path,同样注意打红框的几个地方
1
2
3
4
5
6
7
8
9
10
//就按这个填,这是仓库中存放 MD 文章的文件夹
Root folder = source/_post
//定义一个键值,来确定推送到远程仓库中的文件名,也可以不设置
//设置后,同时在文件属性 `front matter` 中增加字段 `filename: obsidian-anzhiyu`,
//则无论你在OB中的文件名是什么,推送到仓库中的文件名都是`obsidian-anzhiyu.md`
Set the key where to get the value of the filename = filename
//建议关闭,当然也可以打开,打开后,同时在文件属性`front matter`中增加字段`delete: false`
//文章将被标记为`不删除`,如果后期你想从博客中删除这篇文章,将`false`改为`true`
//重新发布即可删除
Auto clean up = 建议关闭

image.png

  • 设置 第三页:plugin settingsFile menuEditor menu 都开启,这会在 OB 界面顶部文章的标签页的右键菜单和左侧文章列表的右键菜单增加一个 Upload anzhiyu-obsidian to DEFAULT 的选项,点击即可快速发布

image.png

  • 至此,发布插件配置完成,其他可以保持默认
  • 另外,最好在本地博客仓库根目录的 .gitignore 文件中,排除以下文件夹,以便于使用其他软件如 vscode、github desktop 进行同步时,不要把 OB 的配置文件一并上传了
1
2
3
.obsidian/
文章模板/
.vscode/

写文章和发布

  • 在 OB 左侧列表点击新建笔记,写一篇文章
  • 在文章头部配置 front matter,格式请看 安知鱼官方文档
  • 在文章列表单击右键,点击 Upload anzhiyu-obsidian to DEFAULT 发布文章,等待 cf 自动拉取源码部署,约 1-2 分钟访问博客,即可看到发布的文章

image.png

进阶使用

OB 的编辑功能非常强大,其内置的 反向链接 功能,可以把文章中的任意段落、文字、图表链接到另一篇文章中,使零散的知识在本地形成完整的知识体系;还有其 标签系统 也非常便利。它不仅仅是一个笔记编辑软件,更是一个支持双链的知识管理软件。感兴趣的小伙伴可以学习一下这两篇文档:双向链接内部链接,这是完整的 中文文档,非常详尽,这里就不赘述

个人推荐以下神级插件:

插件命名 主要功能 备注
Advanced Tables 增强表格编辑功能,跟 excel 一样可视化编辑 官方文档
Auto Link Title 粘贴链接时自动以 MD 格式粘贴 官方文档
Editing Toolbar 在编辑器顶部增加一个可视化编辑的工具栏 官方文档
Emoji Toolbar 附加一个 Emoji 工具栏,启动:ctrl+p—输入 emoji 官方文档
Enveloppe 又名 github publisher,上传 MD 到远程 git 库 官方文档
Excel to Markdown Table 直接从 excel 导入表格到 md 官方文档
Image Auto Upload Plugin 自动将粘贴到 md 的图片上传到 piclist 图床并嵌入文档 官方文档
lmage To Lskypro 自动将粘贴到 md 的图片上传到 兰空图床 并嵌入文档 官方文档
Linter 自动格式化 md 文档,使其符合文档规范 官方文档
Omnisearch 增强的搜索功能,支持查找笔记、Office、PDF 和图像 官方文档
Remotely Save 设置同步,支持 S3、webdav 和各大网盘 官方文档
Text Extractor 从附件中提取文字,支持 OCR 识别图片 官方文档
Templater 设置模板,支持插入变量和函数结果 官方文档

这里主要讲几个和 MD 编辑便利性、文章发布便利性相关的插件

Templater:设置模板,支持插入变量和函数结果

设置好插件后,在 OB 左侧列表新建一个文件夹并命名(如:文章模板,与你在插件设置里的名称保持一致),然后在这个文件夹下新建一个 md 文件,命名为 安知鱼博客模板,将文章属性 front matter 作为一个模板写入文件,以后写文章只需要 ctrl+p——输入 模板——插入模板——选择 安知鱼博客模板,就可以直接在文章头部生成 front matter

Enveloppe:上传文章到 Github 库并自动发布到博客

这个上面已经讲过了,发布文章到博客靠的就是他。当然还有类似的插件,比如 GitHub Sync,可以和 vscode 一样直接将整个本地仓库与远程仓库保持同步,具体可以自行研究。还有 Hexo Publisher,专为发布博客文章而设计

图床插件:自动将粘贴到 Md 的图片上传到远程图床并插入文档

如果你在自己的服务器部署了兰空图床或者本地电脑安装了 piclist 桌面版,则 lmage To Lskypro 或 Image Auto Upload Plugin 插件能为插入图片带来极大便利

1. Lmage To Lskypro

前提是部署了兰空图床。部署教程:Lsky Pro。在 serv00 上也可以部署,具体教程可自行搜索

打开插件的 设置 界面,选中 Image To Lskypro,开始设置该插件,按图所示:域名填写你部署服务后的域名,token 需要借助这个 在线post工具 获取(详细教程

1
2
3
LskyPro 域名 = 你部署的图床服务的地址,需要加 https://
LskyPro Token = 在获取到token前加 Bearer,格式为<Bearer token值>,注意中间有个空格
LskyPro Strategy id = 你在兰空存储策略里的设置,填写策略前面的 ID

image.png

2. Image Auto Upload Plugin

如果你不会部署图床服务,没关系,下载安装 桌面版piclist

安装好后,配置好 图床监听server(一般是 127.0.0.7:36677),让他保持在后台运行,即可实现自动上传。详见 官方文档

建议尽量部署一个图床服务,其好处是无需开启本地监听服务,直接通过 API 上传图片,使用手机版 OB 也能轻松自动上传图床

写在最后

OB 真的是一款非常强大好用的知识管理软件,但是其使用有一定的学习门槛,如果实在搞不清楚,那么可以只使用 OB 来编辑文章,而同步工作仍然交给 vscode 或 github desktop;如果 vscode 或 github desktop 你也不会,我给一个 最简单的方式

  • 按照 我的博客部署教程 将源码推送到远程仓库并部署到 cf pages
  • 在远程仓库中的 source/_post 文件夹中直接新建 md 文件,或者将在本地写好的 md 文件直接上传到这个文件夹中
  • 点击保存并提交,完事