侧边栏添加可调用网易云音乐&腾讯音乐的播放器-记录

这段代码的作用是将APlayer和MetingJS的CSS样式表和JavaScript文件引入到网站中，以便在页面上使用这些库。

代码详解

1. enqueue_aplayer_and_metingjs 函数

• 这是一个自定义函数，负责将APlayer和MetingJS的外部资源（CSS和JavaScript文件）加载到WordPress的页面中。

2. wp_enqueue_style

• wp_enqueue_style('aplayer-css', 'https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css');
• 这个函数用于注册并加载一个CSS文件。
• 'aplayer-css' 是一个唯一的句柄，用于标识这个样式表。
• 'https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css' 是样式表的URL。
• 通过这个函数，能确保这个CSS文件在需要的页面中正确加载。

3. wp_enqueue_script

• wp_enqueue_script('aplayer-js', 'https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js', array(), null, true);
• 这个函数用于注册并加载一个JavaScript文件。
• 'aplayer-js' 是一个唯一的句柄，用于标识这个脚本。
• 'https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js' 是脚本文件的URL。
• array() 表示此脚本没有任何依赖的其他脚本。如果有依赖的脚本，可以在数组中列出它们的句柄。
• null 是脚本的版本号，可以用来强制浏览器重新加载新的脚本版本。null 表示不指定版本号。
• true 表示将脚本放置在页面的底部（即在 </body> 标签之前），以确保页面的其他内容在脚本加载前被渲染。这有助于提升页面加载速度。
• wp_enqueue_script('meting-js', 'https://cdn.jsdelivr.net/npm/meting@2.0.1/dist/Meting.min.js', array(), null, true);
• 与上面的 wp_enqueue_script 类似，加载的是 MetingJS 的 JavaScript 文件。

4. add_action

• add_action('wp_enqueue_scripts', 'enqueue_aplayer_and_metingjs');
• add_action 是一个 WordPress 钩子函数，用于将 enqueue_aplayer_and_metingjs 函数挂载到 wp_enqueue_scripts 钩子上。
• wp_enqueue_scripts 是 WordPress 中的一个动作钩子，专门用于在适当的时候加载样式表和脚本。
• 通过这个钩子，WordPress 会在正确的时机（通常是在页面加载时）自动调用 enqueue_applayer_and_metingjs 函数，从而确保APlayer和MetingJS的资源被加载到页面中。

属性详解

• style="color: #000":
  • 用于设置播放器的样式属性。这里设置了颜色为黑色 (#000)，这个颜色将应用到播放器的文本或其他相关元素上。
• class="meting":
  • 设置标签的 CSS 类名为 meting，这可以帮助通过自定义 CSS 样式来进一步控制播放器的外观和布局。
• server="netease":
  • 指定音乐来源服务器。在这里，netease 表示音乐将从网易云音乐获取。其他可能的值包括 tencent（腾讯音乐）和 kugou（酷狗音乐）等。
• type="playlist":
  • 指定播放器加载的音乐类型。playlist 表示加载的是一个播放列表。其他可能的类型包括 song（单曲）和 album（专辑）等。
• volume="1":
  • 设置播放器的初始音量。1 表示最大音量（100%），0.5 表示50%的音量，依此类推。
• id="8829630010":
  • 这是网易云音乐中的播放列表 ID。播放器将根据这个 ID 从网易云音乐加载对应的播放列表。
• fixed="false":
  • 控制播放器是否固定在页面的底部。如果设置为 true，播放器会固定在屏幕底部，不随页面滚动而移动。设置为 false 则播放器会出现在页面的当前插入位置，并随页面滚动。
• autoplay="false":
  • 控制播放器是否自动播放。设置为 false 表示页面加载时不会自动播放音乐；true 则会在页面加载后自动开始播放。
• loop="all":
  • 设置播放列表循环模式。all 表示循环播放列表中的所有歌曲。其他可能的值包括 one（单曲循环）和 none（不循环）。
• order="random":
  • 设置播放顺序。random 表示随机播放列表中的歌曲。其他可能的值包括 list（按列表顺序播放）。
• preload="auto":
  • 设置音频文件的预加载行为。auto 表示浏览器会尽量预加载音频文件，以减少播放时的延迟。其他可能的值包括 none（不预加载）和 metadata（仅加载元数据）。
• list-folded="true":
  • 控制播放列表是否默认折叠。true 表示播放列表初始状态为折叠，用户需要点击展开以查看列表。false 则默认展开播放列表。
• list-max-height="300px":
  • 设置播放列表的最大高度。如果播放列表的高度超过这个值，列表将变为可滚动的，最大高度在这里被设置为 300 像素。
• lrc-type="0":
  • 控制歌词显示模式。0 表示不显示歌词。其他值可以包括 1（嵌入的 LRC 歌词）和 3（匹配外部 LRC 歌词）。