Hexo 的next主题下添加网易云音乐作BGM

最新推荐文章于 2025-06-27 09:25:00 发布

转载最新推荐文章于 2025-06-27 09:25:00 发布 · 674 阅读

2 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/Guhongying/p/10461970.html

文章标签：

#markdown

本文介绍如何在Hexo博客的Next主题中添加网易云音乐播放器，通过修改sidebar.swig文件并配置_yml文件，实现背景音乐的自动播放。文章提供了两种方法，一种是直接插入HTML代码，另一种是通过配置变量。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首先，你要看看你选中的歌能不能在网页版的网易云音乐生成外链，因为版权保护原因，有些音乐是生不成外链的，比如这样的：

所以，选些可以生成外链的音乐。生成对应的外链

比如这里的重点是HTML代码中的src //music.163.com/outchain/player?type=2&id=33911781&auto=1&height=66 这是待会要用到的部分

然后打开你的 hexo目录下的 themes\next\layout\_macro 的sidebar.swig 将以下的代码添加进去

<div id="music163player">
    <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=280 height=86 src="//music.163.com/outchain/player?type=2&id=33911781&auto=1&height=66">
    </iframe>
</div>

这是一种方法，原文请点击： hexo+next主题优化之加入网易云音乐、网易云跟帖、炫酷动态背景

但这种方法我没有实际操作，我用的是另一种，应该本质都是一样的。

先把另一种方法的出处摆上来：给hexo博客next主题添加背景音乐

第一步：修改 themes/next/layout/_macro/sidebar.swig 文件

红色框框内的是新加的，好像看过一个说法，说 width=“210” height=“110” 这里应该加上双引号？忘看具体原因，回头也找不到那个网页了，有知道的可以在评论区指正。

 {% if theme.background_music %}
           <div>
              <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width="210" height="110" src="{{ theme.background_music }}"></iframe>
           </div>
{% endif %}