Hexo 插件系统简介以及几个插件的用法配置
作为一个可定制性极强的插件框架,hexo 支持方便地加载各种插件定制博客生成环节的每一步。也正因为此,围绕 hexo 诞生了一个活跃的插件开发社区.
我用 hexo 建博客这么久了,也出于需要寻找过插件, 还安装了不少。有些插件虽然功能优秀但是很久没更新了。因为实在是特别想要, 自己被迫肩负起维护的重任。还有想要的功能找不到合适的插件, 只能自己从头写起。于是就花了不少时间研究了一下 hexo 的插件系统. 为了让以后的自己不用费时费力从头学起,也希望能帮助到更多的朋友, 所以就把一些研究的重点写下来。顺便再附带上几款知名插件的配置和用法.
Markdown 插件系统简介
Hexo 的插件系统说简单也很简单。一种是简单的脚本, 另一种对应更复杂的正规插件.
脚本
把所有 JS 脚本放到项目根目录的 scripts
下,
hexo 就会在 初始化 的时候加载它们.
插件
为了更好的利用 npm 的分发系统,Hexo
搜寻根目录的 package.json
, 将所有以 "hexo-"
开头的依赖视为插件。然后从根目录的 node_modules
下加载.
就和其它 npm 包一样,
每个插件目录里须要有一个 package.json
描述包的元信息.
例如下面这个插件:
├── index.js |
它的 package.json
应该为:
{ |
各个属性的含义可以顾名思义.
几个重要插件的使用与配置
Hexo-tag-player
Hexo-tag-player 是一个 hexo 插件, 扩展了 hexo 的标记语法以便支持嵌入音乐.
基本用法
{% aplayer 标题 作者 音乐文件定位器 [专辑图片定位器 narrow autoplay width:播放器宽度百分比 lrc:歌词文件定位器] %}
注意一个属性的值内部要是有空格就要使用 "" 括起值来.
示例:
{% aplayer "Caffeine" "Jeff Williams" "caffeine.mp3" "picture.jpg" narrow autoplay "lrc:caffeine.txt" %}
内嵌歌词
{% aplayerlrc "标题" "作者" "音乐文件定位器" "autoplay" %} |
播放列表
{% aplayerlist %} |
MeingJS
MetingJS 是基于 Meting API 的 APlayer 衍生播放器,引入 MetingJS 后,播放器将支持对于 QQ 音乐、网易云音乐、虾米、酷狗、百度等平台的音乐播放。
示例:
{% meting "60198" "netease" "playlist" "autoplay" "mutex:false" "listmaxheight:340px" "preload:none" "theme:#ad7a86"%}
{% meting "5228962805" "netease" "playlist" "theme:#FF4081" "mode:circulation" "mutex:true" "listmaxheight:340px" "preload:auto" %}
选项
选项 | 默认值 | 描述 |
---|---|---|
id | 必须值 | 歌曲 id / 播放列表 id / 相册 id / 搜索关键字 |
server | 必须值 | 音乐平台: netease, tencent, kugou, xiami, baidu |
type | 必须值 | song, playlist, album, search, artist |
fixed | false | 开启固定模式 |
mini | false | 开启迷你模式 |
loop | all | 列表循环模式:all, one,none |
order | list | 列表播放模式: list, random |
volume | 0.7 | 播放器音量 |
lrctype | 0 | 歌词格式类型 |
listfolded | false | 指定音乐播放列表是否折叠 |
storagename | metingjs | LocalStorage 中存储播放器设定的键名 |
autoplay | true | 自动播放,移动端浏览器暂时不支持此功能 |
mutex | true | 该选项开启时,如果同页面有其他 aplayer 播放,该播放器会暂停 |
listmaxheight | 340px | 播放列表的最大长度 |
preload | auto | 音乐文件预载入模式,可选项: none, metadata, auto |
theme | #ad7a86 | 播放器风格色彩设置 |
PJAX 兼容
若在 Hexo 中使用了 PJAX,可能需要自己手动清理 APlayer 全局实例:
$(document).on('pjax:start', function () { |
hexo-geneator-index
设置
Hexo _config.yml
设置了首页排序以及每页文章数量等选项
# Home page setting |
path:文章起始页面路径 per_page:每页显示文章数量 order_by:排序(默认按日期降序) 在文章的 Front Matter 中添加参数 sticky 即可实现首页置顶,数字越大排序越高(升序排序)
hexo-abbrlink
hexo-abbrlink 是一个根据文章标题, 文章内容生成唯一 ID 永久链接的插件.
这个插件给 hexo 的 permalink
选项添加了新的关键字:abbrlink
. 通过替换这个关键字来达到参与生成永久链接的目的.
它的配置有:
# abbrlink config |
Hexo-Next-Coauthor
hexo-next-coauthor 能够文章添加上共同作者.
安装后,在 front-matter 中加入 coauthor
字段,如
coauthor: Mr.J |
共同作者可以添加多个:
coauthor: |
或者提供更多有关共同作者的信息:
# Add some descriptions to your co-authors |
可以在 source/_data/languages.yml
中加入国际化内容
default: |