1、在页头head标签里添加:

<link rel="stylesheet" href="https://static.likepoems.com/cdn/aplayer/APlayer.min.css">
<script src="https://static.likepoems.com/cdn/aplayer/APlayer.min.js"></script>
<script src="https://static.likepoems.com/cdn/aplayer/Meting.min.js"></script>

2、在页脚footer标签里(/body前)添加:

<div>
<meting-js
server="tencent"
type="playlist"
id="8268823919"
fixed="true"
autoplay="false"
loop="all"
preload="auto"
volume="0.6"
list-folded="true"
list-max-height="500px"
>
</meting-js>
</div>

3、相应配置

常见的配置:

参数 默认 描述
server 音乐平台:netease, tencent, kugou, xiami, baidu
type 播放的音乐类型,值:song, playlist, album, search, artist
id 歌曲id/播放列表id/专辑id/搜索关键字
mini false 迷你模式
fixed false 启用固定模式, 默认位置在左下角
autoplay false 音频自动播放
order false 排序,值:list, random
loop all 循环播放,值:all, one, none
preload auto 预加载,值:'none', 'metadata', 'auto'
volume 0.7 音量,值:0~1
list-folded false 表示歌单列表是否折叠
list-max-height 示歌单列表的最大高度

详情见Apayer以及MetingJS

在博客中实现播放音乐功能(QQ,网易,酷狗,虾米,百度)的更多相关文章

  1. 在CSDN博客中添加量子恒道统计功能的做法

    作者:朱金灿 来源:http://blog.csdn.net/clever101 什么是量子恒道统计?量子恒道统计是一套免费的网站流量统计分析系统.致力于为所有个人站长.个人博主.所有网站管理者.第三 ...

  2. 个人博客添加网易云音乐Flash插件

    博客底部添加网易云音乐播放插件 歌单或者歌曲外链可从音乐界面"生成外链播放器"中得到,选择Flash播放插件即可 footer.html文件增加 实现效果: 历史精选文章: Jli ...

  3. 主题博客添加 h5 贴边音乐插件

    前言: 前几日,在逛微博的时候,发现微博主页的左下角有一个贴边的音乐小插件,我顿时就想在自己博客上也弄一个玩玩.当时就想把微博那个移植过来,首先我用谷歌浏览器F12 查看页面源码,和检查元素代码,发现 ...

  4. 在hexo静态博客中利用d3-cloud来展现标签云

    效果: http://lucyhao.com/tags/ hexo自带的tag cloud的标签展现不太美观,想能够展现出“云”效果的标签.在网上找到了d3-cloud这个项目,github地址:ht ...

  5. Django1.9开发博客(7)- 实现功能

    到目前为止我们已经完成了一个django应用的所有基础部分. 包括url配置.视图.模型和模板.接下来开始继续完善我们的博客系统了. 首先我们需要一个显示每篇文章的详细页面,对不? 文章详情 对于首页 ...

  6. 在个人博客中优雅的使用Gitalk评论插件

    在上一篇博客<程序员如何从0到1搭建自己的技术博客>中,我们了解了如何快速的从0到1搭建一个个人博客. 其实细心的你会发现,该博客用到了一个评论插件,这个插件就是Gitalk. 如果想要在 ...

  7. 如何将word中的图片和文字导入自己的博客中

    目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...

  8. 怎样将word中的图片插入到CSDN博客中

    目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...

  9. 如何在hexo博客中在线阅读pdf

    前言 有一些资料或者笔记是pdf版本的,如果想要放在博客中进行阅读,那么就得将其转换为markdown格式或者html格式.但是这样转换后,其原pdf的格式就会混乱了,排版将会变得很困难,不过一山更比 ...

随机推荐

  1. Python小游戏——外星人入侵(保姆级教程)第一章 07调整飞船速度 08限制飞船活动范围

    系列文章目录 第一章:武装飞船 07调整飞船速度 08限制飞船活动范围 一.代码及演示 1.修改settings 修改文件:settings.py 点击查看代码 #渗透小红帽python的学习之路 # ...

  2. 【美国血统 American Heritage 题解】已知前序中序 求后序

    题目: 题目名称:美国血统 American Heritage 题目来源:美国血统 American Heritage ## 题目描述 农夫约翰非常认真地对待他的奶牛们的血统.然而他不是一个真正优秀的 ...

  3. C#基础_手动书写XML

    XML文档内容: 1.文档声明2.元素=标签 文档总至少要有一个根元素3.属性4.注释   <!--注释内容-->5.CDATA区.特殊字符 <![CDATA[不想解析的内容]]&g ...

  4. bind搭建内网DNS服务器架构(主从、子域授权、DNS转发器)

    实验目的 模拟企业DNS服务架构服务器及原理 实验环境准备 实验架构图 实验设备 DNS服务器4台 主服务器master(centos8):IP_192.168.100.30, 从服务器slave(r ...

  5. C++ 性能小测 1 二维数组的遍历效率

    C++ 性能小测 1 二维数组的遍历效率 遍历二维数组时,常规思路是使用一个嵌套循环.一方面,由于 CPU 使用了分支预测技术,因此通常将循环次数最多循环的放在最内层.另一方面,由于二维数组是按行存储 ...

  6. VS Code 之KoroFileHeader插件

    设置 在vscode左下角点击设置按钮,选择"设置",然后输入"fileheader", 文件头部注释:Fileheader:custom Made 函数注释: ...

  7. KingbaseESV8R6不同隔离级下xmin的区别

    背景 sys_stat_activity视图中用两个字段表示: backend_xid表示事务开始需要申请的事务id backend_xmin表示一个事务快照,表示当前数据库中最小的正在运行的事务号, ...

  8. 5.第四篇 Etcd存储组件高可用部署

    文章转载自:https://mp.weixin.qq.com/s?__biz=MzI1MDgwNzQ1MQ==&mid=2247483792&idx=1&sn=b991443c ...

  9. Elasticsearch:Index生命周期管理入门

    如果您要处理时间序列数据,则不想将所有内容连续转储到单个索引中. 取而代之的是,您可以定期将数据滚动到新索引,以防止数据过大而又缓慢又昂贵. 随着索引的老化和查询频率的降低,您可能会将其转移到价格较低 ...

  10. KVM更改虚拟机默认存储路径

    Virt默认的虚拟机存储路径是/var/lib/libvirt/images,如下图所示 接下来我们创建一个新的存储池,用来存储新建的虚拟机.存储池的名称为vm, 路径为/home/kvm/ (/ho ...