新增音乐短代码功能支持

发表于： 分类于：
字数： 608 阅读：≈ 2分钟 浏览：
温馨提醒
总结摘要
分享下如何在 Hugo NexT 主题中给文章添加音乐播放器嵌入的支持，让你的文章增加有音乐背景不一样的风采。

文字描述是人类自我表达的一种方式，而音乐也是另一种表达的方式，给文章添加上音乐作为背景，或许更能让读者深切体会到作者的情境并引起共鸣。通过 APlayer 和 MetingJS 库能够很轻松地实现在文章中内嵌音乐播放，同时也支持多种音乐平台，下面就来看看具体的操作方法和实现效果。

在 Hugo NexT 主题中，可以在文章的任意位置直接使用 music 短代码嵌入音乐，也支持在同一篇文章中插入多个音乐播放器。相关参数如下：

参数名 默认 说明
id 必选 音乐 ID，即音乐在音乐平台的唯一标识符
server 必选 音乐平台，支持 netease、tencent、kugou、baidu 和 xiami
type 必选 播放类型，支持 song、playlist、album、search 和 artist
auto 可选 音乐地址，仅支持 server 参数中的平台
theme #448aff 播放器主题色
url 空 自定义音乐源 URL
name 空 音乐名称
artist 空 音乐作者
cover 空 音乐封面 URL
fixed false 是否使用固定播放器
mini false 是否显示迷你播放器
autoplay false 是否自动播放
loop all 循环方式，支持 all、one 和 none
order list 播放顺序，支持 list 和 random
volume 0.7 默认音量
mutex true 多个播放器存在时，是否只允许当前播放器播放
list-folded false 是否折叠播放列表
list-max-height 340px 播放列表最大高度

在需要使用音乐播放器的位置插入如下代码：

1

{{< music server="netease" type="playlist" id="7273286178" autoplay="true" list-max-height="140" >}}

实际播放效果：

注意

各大音乐平台通常只支持非 VIP 音乐进行外链播放。MetingJS 同时支持自定义音乐源，用户可以自行上传音乐或使用其他共享渠道播放；使用音乐资源时请注意版权并自行负责。

至此，Hugo NexT 主题的文章就可以使用音乐播放器功能，为内容增加更丰富的表达方式。