本文主要介绍在搭建Blog中遇到的问题和重点记录
框架：Hexo　　　主题：Butterfly

Hexo搭建：https://zhuanlan.zhihu.com/p/102592286
主题设置：https://butterfly.js.org/

搭建

这部分内容后期再更新

核心就是：遇到问题，一定要解决，哪怕是warm，不然后面会很多坑。

基本上所有问题都是可以在网上查到并解决。

安装nodejs

node -v 和 npm -v

原作者在执行这两个命令时，除了版本信息外，是没有任何其余的提示信息的。
如果遇到其他信息，一定要尽可能解决掉再往下。

hexo-cli安装

上一步不解决，问题同样会出现在这部分。
就是上面的问题解决了，这里依旧可能会有问题。
我这里遇到的是：需要执行一个命令：
直接执行那个命令就好，如果不执行，下面的步骤会出问题。
执行完之后，不要再回去执行安装命令了。
接着执行下面的步骤就行。



主题设置

按照Butterfly基本都能设置好。

有空再更新吧，回头看也没什么更新的。

各个目录的内容

theme/_config.yml: 大部分功能模块的增减都在这里设置。
　　　　　　　　　　　这些功能模块的简单设置也是在这里。

inject引入外部内容

这里的根目录是source进入的那个目录。
各个资源要放在对应的目录下，不要再在对应目录下创建文件。这是两种不同的引用方式：
　　前者是可以直接在链接里引用。
　　后者还要引入目录。

source目录下创建文件夹，在被引用的时候可以用相对路径。



链接

　参考source link页



音乐

网易云音乐外链

　　支持的内容：单曲、歌单、专辑、电台节目

  1. 打开网易云音乐网页版，找到喜欢的歌曲，旁边直接有生成外链播放器
  2. 将生成的代码放置需要播放的page页即可(markdown).

本地音频播放

  • 在对应的page页插入以下代码即可：

    1
    2
    3
    <audio controls name="media">
       <source src="/music/梦醒时分.m4a" type="audio/mp3">
    </audio>


音乐模块

　　参考内容：配置参考、　butterfly、　hexo-tag-aplayer

  1. 安装插件
    npm install --save hexo-tag-aplayer

    • 用git安装时，会出现node识别不到的问题
      　　解决：用管理员的cmd，在对应的Blog下面直接，就不会出现这个问题。

  2. Hexo: _config.yml 添加以下配置

    1
    2
    3
    4
    # Inject the css and script (aplayer/meting)
    aplayerInject:
      enable: true
      per_page: true

  3. theme: _config.yml 修改下面的参数

    1
    2
    3
    4
    # Inject the css and script (aplayer/meting)
    aplayerInject:
      enable: true
      per_page: true

  4. 配置音乐页面：source\music\index.md

    1
    2
    3
    4
    5
    6
    ---
    title: 音乐
    date: 2019-05-17 16:14:00
    type: music
    ---
    {% meting "7586495396" "netease" "playlist" "autoplay" "mutex:false" "listmaxheight:400px" "preload:none" "theme:#ad7a86"%}

  5. 成品：娱乐-音乐
    这个软件和hexo-tag-mmedia冲突，所以卸载了。



媒体模块

　　hexo-tag-mmedia、easyhexo
　　注意：和上面的代码开头是有区别的。



遗留问题

以下几点是目前还没学会的内容，欢迎指教：
1、搭建的前三章都没有看，后期记得仔细看下有没有遗漏的地方。
2、彩色的菜单栏：https://blog.xmwpro.com/
3、评论功能还是不能用，点击授权也没问用。网上说现在大家都遇到这个问题了。