使用Aplayer+Meting Api为你的博客文章内加入音乐播放器

前言

因为我经常喜欢在博客里分享音乐,所以我也在找可以插入文章的音乐播放器,但是一直没找到,所以只能自己想办法琢磨了,最后的解决办法就是今天这篇文章。

效果演示

Meting.js 介绍

Meting.js 依赖 APlayer.js,扩展了 APlayer.js 的功能,能够使 APlayer.js 加载网易云音乐、QQ 音乐、虾米音乐中的歌单。

实现方法

我自己用的是子比主题,所以就按照子比主题来写了,其他主题类似!

  1. 后台自定义代码内引入这几个js和css
[hidecontent type="reply"]
<!-- require APlayer -->
<link rel="stylesheet" href="https:///APlayer.min.css">
<script src="https:///APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https:///Meting.min.js"></script>
[/hidecontent]

2.在需要的位置插入如下代码即可

[hidecontent type="reply"]
<meting-js
	server="netease"
	type="playlist"
	id="60198">
</meting-js>
[/hidecontent]

这个样子就好了!是不是特别简单!

上一篇 子比美化 - 文章缩略图鼠标悬停自定义图片
下一篇 子比美化 – 为网站添加一个动态灵动岛