纯代码实现给网站添加一个永久免费的HTML5悬浮音乐播放器

发布时间:2021-12-30 12:02

这两天在优化自己博客时突然特别单调,总觉的少了点什么,自己电脑的网易云推荐的一些歌也真的是一言难尽,所以就想着给自己的博客添加制作一个底部磁吸的悬浮播放器,这样子逛博客的时候也能听歌缓解一下

特色功能

1、只需四行代码,源码我上载在 jsdelivr 及 Gitee,秒加载,

PS:调用别人的源码总觉得他倒闭了怎么办,那就没法用了,反正我是这么想的~所以我把源码上传到永久地址!

2、所有歌曲调用网易云歌曲,只要网易不倒闭就能一直用

3、内置集成网易云歌词 LSC 文件,播放有歌词预览

4、可以在任何你想添加的页面添加,无需插件

5、歌是曲网易云热歌 TOP 榜单集成了将近上百首,后面会持续更新

代码如下:

<link rel="stylesheet" href="https://zhoudadatool.gitee.io/mizhimusic/yinyue/dist/QPlayer.css"> 
<script src="https://zhoudadatool.gitee.io/mizhimusic/yinyue/dist/QPlayer.js"></script> 
<!--自动展开歌词及列表-默认 关闭,需要的话打开删除注释代码即可--> 
<!--我是注释<script src="https://zhoudadatool.gitee.io/mizhimusic/yinyue/dist/script.js"></script> 我是注释--> 
<!--<script src="https://zhoudadatool.gitee.io/mizhimusic/yinyue/dist/gedan.js"></script>

效果图:

使用教程

具体实际效果可以根据本站看实际效果,下方提供三种添加方法,具体根据自己的情况选择添加下方代码

子比主题快速添加方式:

添加路径:子比主题后台—>自定义代码—>自定义底部 HTML 代码—>添加下方的代码

其他博客主题添加方式:

将下方代码添加至网站底部文件即可:例如:foot.php

单页的 php 和 html 添加方式:

将下方代码直接添加在 index.html(php)首页文件底部就可以

 

WordPress纯代码实现文章相关推荐功能 WordPress

WordPress纯代码实现文章相关推荐功能

这两天准备把的相关推荐功能进行了重写,将原来的文章相关推荐功能做了自我感觉非常优秀的改进,相比用其它 WordPress 相关文章推荐的插件来说,我更喜欢自己来折腾,经过这一番的重写 WordPres...