在hexo博客上使用aplayer

在hexo博客上使用aplayer

起因

因为以前我配置aplayer遇到了挺多难题的

配置好之后 hexo s一看

没问题啊😕

但是hexo g -d上传完打开链接一看文字链接打不开🤔

而现在 我才知道配置错了

开始教程

如果使用的是butterfly的主题

可以直接在inject里面找到headbottom分别写

先在head里面添加

1
2
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css"  media="defer" onload="this.media='all'">
- <meting-js server='netease' type='playlist' id='5291772497' fixed='true'></meting-js>

image-20210517195613644

酱紫添加就ok了😉

之后在bottom里面添加

1
2
- <script async src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js"></script>
- <script async src="https://cdn.jsdelivr.net/npm/meting/dist/Meting.min.js"></script>

image-20210517201134139

之后就enjoy

高级一些的操作

如果想像本站那样切换页面不暂停音乐

只要开启一下pjax

image-20210517200352325

需要把enable里面的值改成true 它默认是关闭的

就算是自己刷新页面或者刷新JavaScript脚本,耶稣也救不了你