Gridea NexT主题使用MetingJS解析歌单
通过本文,你可以在博客直接添加一个歌单,而无需一首一首的添加音乐。
本教程理论上同样适用于其他主题,但在细节上会有所不同。
- 效果:如本站所示。
- 本文需要修改主题模板文件。
- 对于Gridea NexT主题,请将 主题>自定义配置>音乐>音乐插件 设置为“无”。
引入Aplayer
如果你使用的博客主题没有引入Aplayer,请在适当位置引入它:
对于Gridea NexT主题,请在templates>_blocks文件夹中的music.ejs文件末尾添加下面的代码:
<link rel="stylesheet" href="https://unpkg.com/aplayer@1.10.1/dist/APlayer.min.css"> |
引入MetingJS
在适当位置添加下面代码(在Aplayer下方引入即可):
<script src="https://unpkg.com/meting@2.0.1/dist/Meting.min.js"></script> |
MetingJs参数配置
参考 https://github.com/metowolf/MetingJS 。
| 参数 | 默认值 | 描述 |
|---|---|---|
| id | 必要 | 歌曲ID/播放列表ID/专辑ID/搜索关键字 |
| server | 必要 | 音乐平台,值:netease, tencent, kugou, xiami, baidu |
| type | 必要 | 值:song, playlist, album, search, artist |
| auto | 可选 | 音乐链接,支持:netease, tencent, xiami |
| fixed | false |
启用固定模式(播放器固定在网页左下角) |
| mini | false |
开启迷你模式 |
| autoplay | false |
音频自动播放 |
| theme | #2980b9 |
主题颜色 |
| loop | all |
播放器循环播放,值: all, one, none |
| order | list |
播放器播放顺序,值: list, random |
| preload | auto |
预加载,值: none, metadata, auto |
| volume | 0.7 |
默认音量,注意播放器会记住用户设置,用户自己设置音量后默认音量将失效 |
| mutex | true |
防止同时播放多个播放器,当该播放器开始播放时暂停其他播放器 |
| lrc-type | 0 |
抒情类型 |
| list-folded | false |
指示列表是否应首先折叠 |
| list-max-height | 340px |
列出最大高度 |
| storage-name | metingjs |
存储播放器设置的 localStorage 键 |
- 此处给出本网站的参数作为示例:
<meting-js |
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 Aurielの博客!
评论











