本文方法只在相关版本下测试使用，未做全面测试，也不保证其他版本可用。

相关版本说明：
hexo：6.0.0
hexo-theme-butterfly：4.0.1
hexo-tag-aplayer：3.0.4

Butterfly 播放音乐

安装插件

  • 在 hexo 根目录安装 hexo-tag-aplayer

    1
    npm install --save hexo-tag-aplayer

配置

  • 直接在需要插入音乐的 post 网页中 Front-matter 中添加

    1
    aplayer: true

插入音乐

  • 单曲

    • aplayer 自定义方法

      1
      {% aplayer "Lemon" "米津玄師" "http://music.163.com/song/media/outer/url?id=536622304.mp3" "http://p1.music.126.net/jtPZRUFrSS-nRCjW_LYowQ==/109951166521931227.jpg" "lrc:Lemon.txt" %}

  • 歌单

    • aplayer 自定义方法

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      {% aplayerlist %}
      {
      "showlrc": 3,
      "music": [
      {
      "title": "Lemon",
      "author": "米津玄師",
      "url": "http://music.163.com/song/media/outer/url?id=536622304.mp3",
      "pic": "http://p1.music.126.net/jtPZRUFrSS-nRCjW_LYowQ==/109951166521931227.jpg",
      "lrc": "Lemon.txt"
      }
      ]
      }
      {% endaplayerlist %}

问题

  • 音乐无法播放

    • 使用本地 mp3，需要在资源文件夹加入 mp3

    • 使用网络 url 引入 mp3 资源

      • 网易云音乐 mp3 API 链接

        1
        http://music.163.com/song/media/outer/url?id=歌曲ID.mp3

  • 单曲歌词无法显示

  • 歌单歌词无法显示

    • 使用本地歌词，需要在资源文件夹加入歌词.txt

    • 需要注意相关配置,注意这个 showlrc,需要配置

      1
      2
      3
      4
      5
      6
      7
      {% aplayerlist %}
      {
      "showlrc": 3, //属性值有 1,2,3
      "music": [
      ]
      }
      {% endaplayerlist %}