Obsidian callout 快捷方法
Obsidian 支持 callout (也称作 Admonition)语法用于显示类似 MkDocs Material Theme 的 Admonition Box 效果,日常使用 Obsidian 写 markdown 过程中会用到 callout 帮助文本增加提示、标注等额外信息,由于语法设计的原因 callout 有很多需要记忆和输入的东西,这里有可以提升效率的地方。
Obsidian callout 前世今生
先简单梳理一下 Obsidian callout 的历史,关于 callout 大致分为三个阶段:
- Obsidian < v0.11.8 的阶段,Obsidian 不支持 callout 语法和渲染
- Obsidian < v0.14.0 的阶段,对于 callout 渲染支持需要借助 obsidian-admonition 插件来实现
- Obsidian ≧ v0.14.0 的阶段,Obsidian 官方开始支持 callout
根据 Obsidian 社区的描述,Obsidian callout 语法渲染实现与 Microsoft Docs 保持一致,都是遵照 CommonMark Specification,具体的做法是利用 blockquote 实现 callout 效果渲染,具体语法如下所示:
<!-- 默认语法 -->
> [!INFO]
> Here's a callout block.
<!-- title&body 语法 -->
> [!INFO] here is title
> here is body.
<!-- folding 语法 -->
> [!INFO] -
> folded callout block.
<!-- nested 语法 -->
> [!INFO]
> > [!todo] second nested callout block.
> > > [!example] third nested callout block.
callout 快速输入
由于 callout 需要输入 quoteblock + keyword + style
等诸多内容,显然有效率提升的必要。
使用需求
我自己日常在 Obsidian 中输入 callout 的时候,会遇到几个痛点:
- callout 语法关键字很多,会经常忘记;
- callout 语法需要输入的内容,而这些内容跟正文无关;
- callout 原生渲染样式和关键字支持比较少,无法满足所有写作场景;
快捷方法设计
对于解决上面的需求有一个比较简单直接的思路:
- 自定义 callout,增加关键字支持,增加样式配置(css style + svg);
- QuickAdd 增加一个 Multi Macro 和若干 Capture,每个 Capture 根据关键字添加 callout format content;
- 给 QuickAdd Multi Macro 增加一个快捷键;
效果演示
- 在 obsidian 设置中的 css snippets 增加 callout 自定义配置,具体方法参考 callout customization help,效果如下图所示:
- QuickAdd 命令操作,效果如下图所示:
TODO
关于上面的实现方法简单的总结一下还有待优化的地方:
- Caputure 很多,如果能做到类似 Template 中的变量替换的话,就可以大大减少 Capture 的配置和维护;
- callout CSS 配置目前主要是借鉴了 Primary Theme,自己认为与 Microsoft 的 callout 样式还有差距,需要重新优化;
snippets
上述的实现方法附上 code snippets 方便有需要的人引用,当然也会放到 github gist,不过国内的同学需要懂得如何访问 github gist 才行。使用方法也很简单(如果全量较大可以按需选择关键字):
- css snippets 中增加 callout css 配置;
- quickadd data.json 增加到
{vault-path}/.obsidian/plugins/quickadd/data.json
中即可;