Hexo新姿势！

图源：《三色Δ绘恋》第8幕 烟花大会

Hexo的插件真是个好东西！一开始部署博客的时候并没有太在意插件的问题，毕竟觉得博客主题自带的插件挺全面的，足够使用了。但是用久了总是会腻，就想着静态博客能不能整一些新操作，即使只是添加点小功能。于是就翻了翻 Hexo 的插件目录，挑了些比较有用的插件，拿出来做个总结，同时也是为了方便以后使用做的一个简单记录。

管理员界面

插件是hexo-admin，效果是一个类似CodiMD编辑页面的“管理控制台”，可以实时编辑预览Markdown文章，修改tag，从剪贴板粘贴图片到文章等操作。注意：仅用于hexo s状态下的博客实例。

文章加密

插件是hexo-blog-encrypt，使用前须在站点配置文件加入以下内容：

1
2

encrypt:
    enable: true

随后在文章的开头部分加入password:字段设置密码即可。

同时，配合abstract:字段和message:字段可以设置对无密码人的提示信息。同时注意不要设置toc。

中英文自动空格

插件为hexo-filter-auto-spacing，npm install --save之后就可以用，无需手动设置。

插入行内JS/CSS/图片

插件为hexo-filter-inline-assets。

站点设置：

1
2
3

inline_assets:
    enabled: true
    limit: 100000

随后引入：

1
2

<link rel="stylesheet" href="css/main.css?__inline=true">
<script src="myscript.js?__inline=true"></script>

插入 ASCIInema 终端短视频

插件为hexo-filter-asciinema，作用是允许向博客文章内插入ASCIInema平台的视频。

站点设置：

1
2

asciinema:
    enable: true

随后演示机安装asciinema，sudo apt install asciinema，并对asciinema进行授权，asciinema auth。浏览器打开程序给出的链接，登入账号、查收验证邮件，即可成功启用。使用asciinema rec开始录制。由于该网站被墙，因此可以在录制结束后按<Ctrl+C>保存至本地，并在本地引用。

实例：@asciinema

快速上标

插件为hexo-filter-sup，站点设置：

1
2

sup:
    markup: '^'

实例：x^2^+5=10

文本提示

插件为hexo-tag-hint，实例：大家好，这个博客用了Hexo。

注意字符串中有单引号的时候加反斜线转义。

H5视频

插件为hexo-tag-html5video，实例：

第一行三个参数必须带上，不然默认video/webm。

统一ID

插件为hexo-uuid，作用是给每一个页面自动生成一个UUID字段。你可以拿这个字段做些别的事情，比如将其设置为博文链接什么的。

二维码

插件为hexo-tag-qrcode，实例：

下拉抽屉

插件为hexo-tag-details，实例：

SoundCloud

插件为hexo-tag-soundcloud，实例：

当然，不加链接加Track ID也是可以的。

脚注

插件为hexo-footnotes，实例：我真的喜欢读《三体》¹

支持多行注释和Markdown注释。

PDF 文件

插件为hexo-pdf，实例：（Modeling Singing F0 With Neural Network Driven Transition-Sustain Models - By Kanru Hua）

MPlayer

插入本地MP3文件。插件为hexo-tag-mplayer，实例：

已弃用

文字上标

插件是hexo-ruby-character，需要在Linux环境下编译npm包。

示例：{% ruby Chocolate | Vanilla %} ，也可方便的给汉字注音，例如：{% ruby 鬼魅魍魉 | 鬼魅魍魉 %}，又或者是恶搞，类似： {% ruby 精彩节目 | 前方高能 %}，同时也适用于其他语言，譬如：{% ruby 噓 | うそ %} だの？

由于其依赖包nodejieba兼容性问题，此处不再提供演示。

HTML 标签

插件为hexo-tag-htmltag，使用：

1
2
3

{% htmlTag button type="button" data-submit data-action="add" aria-controls="calc"%}
Add 10
{% endhtmlTag %}

等效HTML代码：

1

<button type="button" data-submit data-action="add" aria-controls="calc">Add 10</button>

由于作者已将该npm包删除，因此演示失效。