前言

初衷

之前写的这篇文章详细的介绍了如何使用aplayer插件给自己的博客添加音乐播放器，体验了一段时间后觉得该播放器应用在在单一页面中使用效果挺好。但如果想作为博客背景音乐播放器还是有很大的局限性，其中最重要的一点是因为博客不支持pjax导致每次切换页面后音乐都会从头播放体验很不好。

在Shawn的推荐下，用上了下面这款播放器，可以前往我的个人主页体验。

声明

因为很多小伙伴在配置这款播放器过程中遇到了问题，为了少让你们跳些坑才有了这篇博客：
创作这篇博客无任何利益驱动，博主也仅为播放器普通用户。

播放器

明月浩空音乐

上面说aplayer用作背景音乐存在局限性，下面这款播放器解决该局限性的方法是断点续播。

点击进入播放器官网，提供两种版本，分别是免费版和付费版：

免费版：
- 每三个月至少使用一次或登陆播放器后台否则回收账号。
- 功能受限（一个歌单，不可批量导入歌曲，个性设置受限（下图））
- 存在广告，注意看下图：
付费版：
- 不存在上述免费版本限制
- 免费提供独立域名播放器：推荐点击这里体验。
- 收费标准：自行前往官网查看。

个人想法：我是花一元买的5000次播放量升级到付费版本，这些播放量对我这小站来说也是足够了，毕竟作者还要为服务器买单，总是白嫖也不好（我主要是想去广告…）。

注册并登陆

点击这里开始注册，输入用户名、密码等信息：

注意保护个人隐私安全！
点击进入后台：
点击确定添加播放器，输入播放器名称：
创建成功，点击下一步：

配置播放器

输入授权域名：

这个功能的目的是防止盗取播放次数，对于付费用户（特别购买播放次数的用户）如果别人盗取了你播放器id将其用于自己网站，那么你的播放次数就得不到保障。
创建歌单：
为歌单添加歌曲：
将歌单加入播放器：

删除原有歌单的原因：免费用户只能添加一个歌单。

开始使用

测试播放器：

如果没有该选项，尝试刷新页面解决。

看自己添加的歌曲是否在歌曲列表中出现。
获取js代码：
在博客中使用（butterfly主题为例）：

查看自己主题的版本号：
- 若< v2.3.5：
  
  配置文件搜索footer_custom_text:，在后面添加上一步获取的js代码，如下图：
  
  如果本地运行时提示：
  
  在刚刚添加的代码前面加上下面的代码：
  1
  <script src="//lib.baomitu.com/jquery/3.3.1/jquery.min.js"></script>
  添加后：
- 若>=v2.3.5：
  
  主题配置文件搜索bottom，将复制的js代码粘贴上去：
  
  注意格式与上图保持一致。

后记

使用hexo s命令本地测试时播放器不能使用，因为在前面步骤中播放器绑定了安全域名，而本地使用的域名是localhost:4000，导致触发限制，执行hexo d命令后将其推到远程仓库，即可在自己博客使用啦！
如果你想拥有会员权限但又接受不了付费条件的话，再推荐一款完全免费的播放器-梨花带雨，具体教程不再给出请自行钻研（差别不大），在hexo框架下尤其是butterfly主题下能否正常使用博主未作测试。
博客最后贴上一张猫猫的懒照，哈哈：