本文已收录至 Butterfly 主题美化教程

为什么选择 Obsidian

放弃 Typora 的理由：

  • Typora 已经收费，目前使用的免费版本已长久不更新，且偶尔出现 Bug。
  • Typora 适合关注于一个 Markdown 文件，不适合文件之间的链接与知识库管理。对于博客或笔记来说，互相链接将有助于加强内容联系，形成自己的知识体系
  • 插件？没听说过也没用过

选择 Obsidian：

  • 关注于知识库的整理，有双向链接的特色
  • Obsidian 对个人用户免费（也有付费方案）并时常维护
  • 有活跃的社区和第三方插件市场
  • 半 WYSIWYG，写文档不至于预览困难
  • 在于博客框架 Hexo 协同工作中有潜力
  • 不影响 Markdown 核心语法的情况下也有很多提高编写效率插件

下文将介绍如何无缝把写作工具迁移到 Obsidian 中。

写作习惯继承及效率提升

快捷键——指尖习惯复刻

一些快捷键先设置好：

image.png

Ctrl + num 的快捷键 Obsidian 给了跳转，刚好 Ctrl + Alt + num 的小标题设置快捷键符合主流编辑器的设置。Typora 的快捷键有点反人类。

文章模板——免写 Font-Matter 或在 Hexo 中敲命令

Obsidian 新建文章时可以快速使用模板。

打开设置 ->模板，插入模板文件夹位置（巧合的是，Hexo 有专门放模板的地方，scaffolds。不过这个需要自己创建，详情查看这篇文章 写作 | Hexo

image.png

一般 scaffolds 文件夹包含这三个 Markdown 文件：

  • draft
  • page
  • post

它们分别对应不同的模板。

post 可以这样写：

1
2
3
4
5
6
7
8
9
---
title: 
date: {{date}} {{time}}
tags:
category:
cover:
description:
top_img:
---

安装相关插件后 category 还可以免写，后文将提到。

因此创建新文章的流程就是：

  1. 新建页面
  2. 输入标题
  3. 点击 Obsidian 左侧的模板按钮
  4. 选择响应的模板即可

当然，可以使用 hexo 原生命令。但是由于模板更改可能还需手动修改部分内容。

图床——和 Typora 图片上传方法一致 易嵌入

配置好 PicGo 图床后 [1]，安装 Obsidian 第三方插件：renmu123/obsidian-image-auto-upload-plugin: auto upload image with picgo (github.com)，记得还要点一下启用插件。

依照说明进行配置 PicGo。然后试着上传图片就行。

文件夹分类——省去手写相关 Font-Matter

Hexo 中安装这个插件即可：xu-song/hexo-auto-category: Generate categories automatically for each post in Hexo (github.com)

Obsidian 第三方插件——用更少的时间写 Markdown

以下插件不会对 Markdown 核心语法造成影响、不会引入奇奇怪怪的语句，但它们可以提升你的写作速度，或以更少的时间排版出更好的版面。

使用此插件可以更方便绘制 Markdown 表格（准确来说属于 GFM）：tgrosinger/advanced-tables-obsidian: Improved table navigation, formatting, and manipulation in Obsidian.md (github.com) 至少我觉得比 Typora 鼠标点来点去方便

文本规范化插件：

让列表支持鼠标拖动以及键盘顺畅调整：vslinko/obsidian-outliner: Work with your lists like in Workflowy or RoamResearch (github.com)

选中文字可直接复制网址：denolehov/obsidian-url-into-selection: Paste URLs into selected text “notion style” (github.com)

Hexo 与 Obsidian 的所见即所得

其实做到上面的内容后，使用原先 Markdown 语法写作就可以了。在基本的 Markdown 写作之上，我们可能还有更多的语法、样式、功能需求。如果能将 Obsidian 里看到的和 Hexo 博客网页中看到的基本达成一致，那么我们的写作习惯进行统一，并可将其语法的运用纳入到我们长期的使用习惯中。

也正是因为追求这种统一，我才会 忌讳 使用所谓 Hexo 特有的标签语法[2]，导致很多功能的实现都有所限制。以下小节将针对这种一致性进行努力探索。

Hexo 对于 Obsidian Flavored Markdown 的渲染

如果想将 OFM 运用于 Hexo 中，提示文本丰富性，那么可以试试这篇文章：Hexo 博客适配 Obsidian 新语法

Plant UML 支持

安装与使用

语法：

1
2
3
4
5
6
7
8
9
10
{% plantuml %}@startuml
Bob -> Alice : hello
Alice -> Wonderland: hello
Wonderland -> next: hello
next -> Last: hello
Last -> next: hello
next -> Wonderland : hello
Wonderland -> Alice : hello
Alice -> Bob: hello
@enduml{% endplantuml %}
BobBobAliceAliceWonderlandWonderlandnextnextLastLasthellohellohellohellohellohellohellohello

两端端各自插件实现：

两端插件的部分不同之处：

Obsidian Hexo
语法使用 只支持 Markdown 的代码语法块 支持 Markdown 语法块外还支持标签语法
PlantUML 不一定需要 @startuml 括住内容 必须使用 @startuml

本地部署

使用 Hexo 插件 miao1007/hexo-filter-plantuml 需注意，当安装该插件并不做任何配置时，插件需要联网使用 PlantUML 接口，且并不是所有国内的 IP 地址都能成功访问这个接口，这就导致了平时 Hexo 本地部署调试时会出错。

错误例子如：

部署失败6546565132.png

image.png

我的解决方法是将 Plantuml 部署在本地。具体本地部署 Plantuml 的方法详见：本地部署 PlantUML

注意

本地使用 PlantUML 的效率相较于使用服务器 API 的效率低

如果选择了本地部署，记得在配置文件 _config.yml 中新增：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
plantuml:
	# Local or PlantUMLServer.
	render: "Local"

	# "inline": <svg>xxx<svg/>
	# "inlineUrlEncode": <img src='data:image/svg+xml;>
	# "inlineBase64": <img src='data:image/svg+xml;base64>
	# "localLink": <img src="/assert/puml/xxxx.svg">
	link: "inline"

	# where your dot binary
	# GraphvizDotFile: "/usr/local/bin/dot"  # 不需要此项配置
	# where your jar
	PlantJar: "你的plantuml.jar" 路径

	# common options: svg/png
	outputFormat: "svg"

	# class-name for element style. The default style is center-aligned block
	className: "plantuml"

Obsidian 插件 joethei/obsidian-plantuml 使用本地 jar 包配置方法：

image.png

本文参考

  1. PicGo(app) 配置腾讯云 COS 图床 ↩︎

  2. 标签插件（Tag Plugins） | Hexo。搞笑的是，我发现 部分插件开发者 称其为「Ugly」的 😂 ↩︎