子比主题添加一个悬浮伸缩侧边栏

效果图

js代码（用于aplayer加载）

audio需要在里面添加歌曲，首页才能正常播放

wordpress无法支持meting的播放器，所以这边使用了aplayer作为音乐播放器

使用lrcType: 3作为歌词显示

const ap = new APlayer({
              container: document.getElementById('aplayer'),
              fixed: true,
              order: 'random',
              preload: 'none',
              volume: 0.25,
              lrcType: 3,
              audio: [
                {
                name: '不眠之夜：星穹铁道',
                artist: '张杰/MOYO-Mix',
                url: 'https://cn-sy1.rains3.com/anxkj.fun/music/%E5%BC%A0%E6%9D%B0%20_%20HOYO-MiX%20-%20%E4%B8%8D%E7%9C%A0%E4%B9%8B%E5%A4%9C.ogg',
                lrc: '/music/lrc/1.lrc',
                cover: 'https://y.qq.com/music/photo_new/T002R300x300M000004ItRwk3R0LYz_1.jpg?max_age=2592000'
                }
              ]
            });

html代码

悬浮伸缩侧边栏的html（轻笑Chuckle的教程里面的主题是hexo butterfly，主题语言是pug格式，这边用到的代码是pug转换为html）

里面的东西可以试着修改一下

CSS代码

侧边栏css代码

css代码还未写完，播放器样式功能可能跟轻笑的不一样

比轻笑Chuckle提供的css多一些（用轻笑Chuckle提供的css会出现赞赏无法正常使用)

颜色代码

弹窗需要用到的颜色代码

后续

如果你有安装音乐播放器的插件，可以不用外部引用js和css文件。

如果没有，需要在你的主题头部添加代码

<link rel="stylesheet" type="text/css" href="/anxkj/fixedcard-dashboard.css" rel="external nofollow" >
 <link rel="stylesheet" href="https://jsd.onmicrosoft.cn/npm/aplayer/dist/APlayer.min.css" rel="external nofollow" >
 <script src="https://jsd.onmicrosoft.cn/npm/aplayer/dist/APlayer.min.js"></script>
 <!-- require MetingJS -->
 <script src="https://jsd.onmicrosoft.cn/npm/meting@2/dist/Meting.min.js"></script>