hexo插入背景音乐

原创已于 2023-02-07 15:54:01 修改 · 1.3k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#css #node.js #html

于 2020-09-25 17:03:07 首次发布

hexo 专栏收录该内容

5 篇文章

订阅专栏

hexo插入音乐

可以到我的博客参考一下样式

两种方式：

单个音乐
歌单

第一种：

这种方式比较简单，直接到网易云搜索需要添加的背景音乐然后生成外链，将外链粘贴到sidebar.swig里边，可以切换粘贴位置以达到自己需要的效果。
这里随便找了首歌的外链粘了进去

vim /blog/themes/next/layout/_macro/sidebar.swig

<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=86 src="//music.163.com/outchain/player?type=3&id=2069329741&auto=1&height=66"></iframe>

第二种：

以歌单的形式插入背景音乐，具体操作如下：

vim /blog/themes/next/layout/_macro/sidebar.swig

<!-- require APlayer -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.css">
    <script src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js"></script>
    <!-- require MetingJS-->
    <script src="https://cdn.jsdelivr.net/npm/meting@2.0.1/dist/Meting.min.js"></script>
    <!--网易云-->
    <meting-js
      server="netease"
      id="3129764102"
          type="playlist"
          mini="false"
      fixed="false"
      list-folded="true"
      autoplay="true"
      volume="0.4"
      theme="#FADFA3"
      order="random"
          loop="all"
      preload="auto"
      mutex="true">
    </meting-js>
    </div>
  </aside>
  <div id="sidebar-dimmer"></div>
{% endmacro %}