qplayer2-wordpress网站底部悬浮音乐播放器

title: "QPlayer2--Wordpress网站底部悬浮音乐播放器"
date: 2021-04-18
categories:
- "教程"
tags:
- "wordpress，qplayer2"
- "音乐播放器"
coverImage: "image-41.png"

网上有很多类似的插件，免费、收费、代码各种有，我喜欢折腾，偏向于开源的，没事看看github，发现个好用的音乐播放器QPlayer2，支持网易云音乐解析。

项目地址：https://github.com/Jrohy/QPlayer-WordPress-Plugin，最新版本为v1.3.4.2，更新于三年前，已不再更新。

如今，MoeShin将代码优化后制成QPlayer2，现已支持WordPress、Typecho、Z-Blog。

一，下载¶

Moeshin的github地址：下载

国内我的gitee地址：下载

二，安装¶

插件默认都放在wp-content/plugins目录下即可

三，设置¶

进入后台设置-QPlayer2，作者都有注释，很简单，这里只说下歌曲设置

• 添加歌单模式

网易云音乐解析，ID：就是歌单的ID（获取歌单ID，需要在网易云网网页版，点击进入喜欢的歌单，可以在地址栏看到歌单ID）

1

[{"server": "netease", "type": "playlist", "id": "2698841554"}]

• 添加单曲模式

单曲模式比较繁琐，自由度高，可以看作者的参数说明：-> Moeshin

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16

[
{
"name": "Nightglow",
"artist": "蔡健雅",
"audio": "https://cdn.jsdelivr.net/gh/moeshin/QPlayer-res/Nightglow.mp3",
"cover": "https://cdn.jsdelivr.net/gh/moeshin/QPlayer-res/Nightglow.jpg",
"lrc": "https://cdn.jsdelivr.net/gh/moeshin/QPlayer-res/Nightglow.lrc"
}，
{
"name": "やわらかな光",
"artist": "やまだ豊",
"audio": "https://cdn.jsdelivr.net/gh/moeshin/QPlayer-res/やわらかな光.mp3",
"cover": "https://cdn.jsdelivr.net/gh/moeshin/QPlayer-res/やわらかな光.jpg",
"lyrics": "[00:00.00]请欣赏"
}
]

四，其他¶

关于图床及音乐库¶

第一种方法：可以使用gitee、github的pages服务做个库（推荐github）

注：github可使用jsdelivrCDN加速

格式：https://cdn.jsdelivr.net/gh///歌曲名.mp3

第二种：使用免费的CDN存储做库，七牛、又拍云都是只是免费的流量有限，推荐第一种。

第三种：使用onedrive网盘做个直连。

关于歌词不显示问题¶

测试后发现可以正常使用github歌词链接，不知道是不是项目作者做有限制还是这些平台有防盗链。