在博客中添加脚注

在Hexo博文中添加脚注需要两个条件, 分别是:

  • 支持脚注(当然还有更多拓展格式和功能,比如表格,比如更好地和HTML、LaTeX等格式互转。这里我们只关心脚注)的Mardown(Multi-Markdown, MMD)
  • 支持MMD的渲染器(Hexo插件)

MMD

本文无意考证Markdown的“语言标准”,止天不生我MMD,Markdown(指基本语法)脚注万古如长夜尔。截止至本文写作时,MMD已经更新至版本6.7.0,详见MMD_GitHub_Page

脚注包括两个部分,第一部分写在正文里,是所有脚注内容的索引;第二部分一般写在文末,是具体地脚注内容,这些内容构成了脚注全体。有了MMD,索引部分在正文中插入[^{footnote_tag}]即可,具体脚注内容写法看起来像这样:[^footnote_tag]: 这是一条插入的脚注,作者用的插件使得代码框内的脚注也生效。渲染之后看起来像这样:

插入一条脚注[1]

当然这里的脚注效果在MMD的基础上增加了悬停显示(鼠标放置在超链接区域时显示脚注内容)和点击跳转(双向跳转)的功能,这些功能是hexo插件提供的,具体见下

Hexo插件

Hexo默认Markdown渲染器不支持脚注语法,需要安装插件,这里以hexo-reference[2]为例。

安装hexo-reference

1
$ npm install hexo-reference --save

并在_config.ymlplugins字段下加入hexo-reference

1
2
plugins:
- hexo-reference

除此之外,

  • hexo-reference-plus[3]
  • hexo-renderer-markdown-it[4]

等插件也可以实现类似的功能。

hexo-reference插件还有一点小bug,包括:

  • 某些情况下Markdown标题不能渲染(hexo-reference-plus也有同样的问题)
  • 代码块中的脚注代码也会被渲染(Markdown又没有足够的转义符规则,只能使用行内代码回避这一问题)
  • 似乎代码块必须指定语言,否则代码块之后的内容无法正确渲染
  • 脚注索引似乎不不支持脚注名(或许是我姿势不对)
  • 脚注编号(页尾)上移,不知道是不是作者有意为之

Markdown2WebPage

用别人的框架果然还是麻烦,更想写自己的静态页面生成器了doge。


  1. 1.这是一条插入的脚注
  2. 2.https://github.com/kchen0x/hexo-reference
  3. 3.https://github.com/maxchang3/hexo-reference-plus
  4. 4.https://github.com/hexojs/hexo-renderer-markdown-it