官方文档

APlayer 播放器的 Hexo 标签插件

安装

npm install --save hexo-tag-aplayer

配置

修改Hexo配置文件(_config.yml)

1
2
3
4
#添加刚刚用npm下载插件的配置在_config文件中 同时实现全局音乐 将asset_inject设置成false
aplayer:
enable: true
asset_inject: false

修改Butterfly主题配置文件

1
2
3
4
# Inject the css and script (aplayer/meting)
aplayerInject:
enable: true # 开启音乐播放器
per_page: true #每个页面都有Aplayer
1
2
3
4
5
6
7
# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
# 插入代码到头部 </head> 之前 和 底部 </body> 之前
inject:
head:
bottom:
- '<div class="aplayer no-destroy" data-id="13985424074" data-server="netease" data-type="playlist" data-fixed="true" data-autoplay="false"> </div>'
1
2
3
4
#实现不会因跳转其他页面而重新播放音乐
#相当于异步请求的ajax
pjax:
enable: true

插入到页面

1
2
3
4
5
6
---
title: 音乐
type: "music"
aside: false
---
{% meting "13945770005" "netease" "playlist" "theme:#b76f40"%}

标签参数

title : 曲目标题
author: 曲目作者
url: 音乐文件 URL 地址
picture_url: (可选) 音乐对应的图片地址
narrow: (可选)播放器袖珍风格
autoplay: (可选) 自动播放,移动端浏览器暂时不支持此功能
width:xxx: (可选) 播放器宽度 (默认: 100%)
lrc:xxx: (可选)歌词文件 URL 地址

有关{% meting %}的选项列表如下:

选项 默认值 描述
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 播放器风格色彩设置