博客园自定义主题中添加迷你音乐插件

说明：这里直接介绍最简单直接的一种设置方式，想深入了解，自己 DIY 的，可滑到本文底部，附有其他大佬的方案。

1. 首先，进入你的博客园后台设置，在开通了 JS 权限（可自定义博客园主题）前提下，找到页脚 HTML 代码选项，将下列示例音乐插件代码复制到页脚 HTML 代码代码框中。

   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
   <script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/Meting.min.js"></script>
   <div>
   <meting-js 
   	server="netease" 
   	type="song" 
   	id="1831467356"
   	fixed="true" 
   	autoplay="false"
   	loop="all"
   	order="list"
   	preload="auto"
   	list-folded="ture"
   	list-max-height="500px"
   	lrc-type="1">
   </meting-js>	
   </div>
   

2. 关键字列表说明如下：

   选项	默认	描述
   id(编号)	require	歌曲ID /播放列表ID /专辑ID /搜索关键字
   server(平台)	require	音乐平台：netease，tencent，kugou，xiami，baidu
   type（类型）	require	song，playlist，album，search，artist
   auto（支持类种 类）	options	音乐链接，支持：netease，tencent，xiami
   fixed（固定模式）	false	启用固定模式，默认false
   mini（迷你模式）	false	启用迷你模式,默认false
   autoplay（自动播放）	false	音频自动播放，默认false
   theme(主题颜色)	#2980b9	默认#2980b9
   loop（循环）	all	播放器循环播放，值：“all”，one”，“none”
   order(顺序)	list	播放器播放顺序，值：“list”，“random”
   preload(加载)	auto	值：“none”，“metadata”，“'auto”
   volume（声量）	0.7	默认音量，请注意播放器会记住用户设置，用户自己设置音量后默认音量将不起作用
   mutex（限制）	true	防止同时播放多个玩家，在该玩家开始播放时暂停其他玩家
   lrc-type（歌词）	0	歌词显示
   list-folded（列表折叠）	false	指示列表是否应该首先折叠
   list-max-height（最大高度）	340px	列出最大高度
   storage-name（储存名称）	metingjs	存储播放器设置的localStorage键

   其实主要需要改的就是 id(编号)、server(平台)、type（类型）即可！

   • id(编号)：需要播放的歌曲/列表/专辑的外链 id（填的是一串数字，如 1831467356）
   • server(平台)：播放的歌曲/列表/专辑是哪个平台（填的是平台名）
   • type(类型)：填播放的音乐类型，如song（单首歌曲），playlist（歌单），album（专辑）等

   注意：以上信息需准确一致，不可填的是列表歌单 id，类型却填的 song，此类！

3. 保存设置，然后刷新博客即可看到迷你音乐插件设置完成。

如果想更详细了解音乐插件的使用，可参考此文：Aplayer搭配Metingjs音乐插件的使用