博客园添加在线音乐播放器

用到的开源技术

https://github.com/DIYgod/APlayer
https://github.com/metowolf/MetingJS

文档

https://aplayer.js.org/#/zh-Hans

安装步骤

打开博客园后台管理页面-》设置-》页脚HTML代码
将下边的代码粘贴进去，保存即可

<!-- 音乐播放器 -->
<!-- require APlayer -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>
<meting-js
        id="5156824747"
        lrc-type="0"
        server="netease"
        order="list"
        type="playlist"
        fixed="true"
        autoplay="false"
        list-olded="true">
</meting-js>

自定义播放列表

说明

上边的代码是我自己创建的播放列表，请自行修改为自己喜欢的歌单，修改的位置主要是id和server。
server-各个音乐平台，主要有，netease网易云、tencentQQ音乐、kugou酷狗音乐、xiami虾米音乐、baidu百度音乐
这里用的平台式网易云，因为网易云的歌单比较容易创建。

网易云歌单id

打开https://music.163.com/#/discover/playlist，找到自己喜欢的歌单，点击进入后，查看浏览器地址栏地址比如https://music.163.com/#/playlist?id=6766661664，这里的6766661664就是歌单的id，将其替换到上边的代码里保存即可。
如果没有自己喜欢的歌单，可以登录网易云后自行创建，查看歌单id的方法同上，需要注意的是，有的歌曲是收费的，这样的歌单有时候不能正常播放，需要注意下。