dedecms网站备份,百度收录提交申请,设计网站建设选题报告,wordpress加动效本文转自博主的个人博客#xff1a;https://blog.zhumengmeng.work,欢迎大家前往查看。 原文链接#xff1a;点我访问 序言#xff1a;最近在网上冲浪#xff0c;发现大家的博客大部分都有一个音乐播放器能够播放音乐#xff0c;随机我也开始寻找解决方法。可是找来找去我… 本文转自博主的个人博客https://blog.zhumengmeng.work,欢迎大家前往查看。 原文链接点我访问 序言最近在网上冲浪发现大家的博客大部分都有一个音乐播放器能够播放音乐随机我也开始寻找解决方法。可是找来找去我却发现在wordpress上的大部分音乐播放器插件无法实现播放网易云歌单但是皇天不负苦心人我找到了APlayer和MetingJS。 一、介绍
Aplayer是一个简洁漂亮、功能强大的 Html5 音乐播放器支持音乐信息、歌词、进度条、音量、顺序模式、循环模式可以使用三方音乐外链也可以使用自己的音乐链接。开源地址https://github.com/DIYgod/APlayerMetingJS 扩展了 APlayer.js 的功能能够使 APlayer.js 加载网易云音乐、QQ 音乐、虾米音乐中的歌单。 开源地址https://github.com/metowolf/MetingJS
二、使用方法
打开wordpress后台管理页面依次点击外观-小工具-添加-自定义HTML。 在编辑栏复制粘贴如下代码 meta charsetUTF-8
meta http-equivX-UA-Compatible contentIEedge
meta nameviewport contentwidthdevice-width, initial-scale1.0
/head
body
link relstylesheet hrefhttps://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css
script srchttps://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js/script
script srchttps://cdn.jsdelivr.net/npm/meting2.0.1/dist/Meting.min.js/script
meting-js stylecolor: #2980b9classmetingserverneteasetypeplaylistvolume0.5id7723752305autoplayfalseloopallorderlistpreloadautolist-foldedtruelist-max-height200pxlrc-type0
/meting-js
/body
/html效果如下图所示 三、参数说明
参数默认值描述idrequire歌曲 ID/歌单 ID/专辑 ID/搜索关键字serverrequire音乐平台: netease, tencent, kugou, xiami, baidutyperequire类型song, playlist, album, search, artistautooptions音乐链接支持: netease, tencent, xiamifixedfalse开启吸底模式minifalse开启迷你模式autoplayfalse自动播放一般浏览器默认会阻止音频自动播放theme#2980b9主题色loopall音频循环播放值’all’、’one’、’none’orderlist音频循环顺序值’list’’random’preloadauto音频预加载值: ‘none’, ‘metadata’, ‘auto’volume0.7默认音量播放器会记住用户设置用户自己设置音量后默认音量将失效mutextrue防止同时播放多个播放器当该播放器开始播放时暂停其他播放器lrc-type0歌词类型list-foldedfalse列表是否先折叠list-max-height340px音频列表最大高度
大家可能会问一个问题歌单 id 怎么找浏览器里打开网易云官网并登录找到自己的歌单点击进去后链接后面那串数字就是ID。
比如https://music.163.com/#/my/m/music/playlist?id77237523057723752305就是ID.