添加全站 APlayer 播放器
原创
之前 @狗子 在群里秀他的 Aplayer，还 post 了博文。然后我一看，哇！这就是我想要的！
他所展示的，是一个固定在网页左下角的 APlayer 播放器，并且配上了自己写的 API 进行歌曲解析，可以说是非常厉害了。
之前一度以为固定在左下角的样式是他自己写的（顿时觉得大佬就是很厉害），然后就要求了几次他开发个插件而不是单单集成在他的主题里面，后来他喊我去读 APlayer 的文档，才发现 Aplayer 自带 fixed mode，也就是我刚刚说的固定左下角的样式（吸底模式）。
然而我 看！不！懂！啊！
折腾了好久都不知道怎么弄啊！
调用都不成功啊！
然后我在 GitHub 找了个 APlayer Demo，确实是成功了。但是我想要实现的是：自动抓取我的网易云 “我喜欢的音乐” 列表，并且播放第一首歌（最新一首我喜欢的歌）。但是 Meting API 又不是太清楚怎么调用……
后来想起来，博客在使用 Memory 主题的时候，曾经在侧边栏放过基于 MetingJS 的 APlayer 播放器，四行代码即可调用：
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.css">
<div class="aplayer" data-id="534542404" data-server="netease" data-type="song"></div>
<script src="https://cdn.jsdelivr.net/npm/aplayer@1.7.0/dist/APlayer.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/meting@1.1.0/dist/Meting.min.js"></script>后来发现，MetingJS 已经支持 Aplayer 1.10.x，已经支持吸底模式了！
所以，稍微改动下代码，就成功了！
这里的外部调用链接没有包含版本号，默认加载最新 release 版本；正常来说不会出什么问题，但是如果需要 100% 稳定运行，建议自行加上版本号。
<!-- MetingJS start -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<div class="aplayer" data-id="2305794885" data-server="netease" data-type="playlist" data-fixed="true" data-autoplay="true"
data-volume="1.0"></div>
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/meting/dist/Meting.min.js"></script>
<!-- MetingJS end -->因为这是纯 HTML 代码，所以可以在任何网站程序（甚至单页 HTML）里面使用。Wordpress 在 footer.php 加入以上代码即可。
提供两个 Demo 以供参考，同时包含了感谢信息：
https://hx.getrbq.com/aplayer.html (GitHub Pages)
https://hx.js.org/statics/aplayer.html (Cloudflare CDN)
目前，全站 APlayer 已经在博客可用：
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。