在我搭建博客的过程中遇到过一些比较棘手的问题，这些内容以10%的内容占有率耗费了我80%的时间；由于个人能力的缘故，解决这些问题的方法就是上google、简书和csdn找。

现在我将我遇到的一些问题和解决方案抄写在这里，作为一个经验总结。

TIPS: 带有下划线的是超链接，可打开；最底端有脚注汇总，里面也有可打开的超链接。

内置播放器#

网易云外链播放器#

想要挂载这个播放器非常的简单，在网络上教程随处可见，因此我只在此提供细节上一些的tips。

网易云的外链播放器选项中有自动播放的功能，但是这个功能很容易被现在的浏览器拦截¹，所以自动播放失效不用担心，这是正常的。
网易云中需要VIP的音乐只能播放30s。

APLAYER播放器#

这个其实相比网易云播放器会更好些，一方面它支持使用metingjs;²另一方面播放器的样式会好看一些（个人观点：网易云的播放器看着有些简陋）。

但是，在我配置的过程中，发现APLAYER官网的方法对我的博客网站毫无作用。。。。。。³

不过最后还是成功找到了方法——直接在源码里面对cdn服务器require插件。

具体做法如下：

在 themes/next/layout/-macro 目录下的 sidebar.swig 文件或 themes/next/layout 目录下的 layout.swig 文件⁴加入以下代码。
 #分别在线请求aplayer和metingjs
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/Meting.min.js"></script>
在请求插件后，便开始配置播放器。将如下代码放入 themes/next/layout/-macro 目录下的 sidebar.swig 文件或 themes/next/layout 目录下的 layout.swig 文件。请自行阅读源码来确定你要插入的位置⁵，代码中的参数都是我自己设好的，你可以参考官方DOCS来自行设置，markdown的表格输入起来还比较麻烦，我也导不出别人表格的markdown源码（别问，问就是菜）。
      
<meting-js
     server = "netease"
     id = "7585293889"
     type = "playlist" 
     mini = "true"
     fixed = "true"
     list-folded = "true"
     autoplay = "true"
     volume = "0.4"
     theme = "#FADFA3"
     order = "random"
     loop = "all"
     lrc_type = 0
     preload = "auto"
     mutex = "true">
</meting-js>

全局播放#

当设置好播放器后，很快便能发现无法全局播放，每切换一个网页就会自动中断播放，需要手动重播，所以我们想要真正让音乐播放器达到应有的效果，就要去配置好全局播放功能。话不多说。

首先直接在git bash中转到hexo根目录下的next主题目录下

$ cd themes/next   

# 在git bash中执行该命令。

安装pjax模块

$ git clone https://github.com/theme-next/theme-next-pjax source/lib/pjax

# 获取pjax模块，将模块安装到source/lib目录

在Next主题的_config.yml文件中，启用pjax模块

# Easily enable fast Ajax navigation on your website.
   # Dependencies: https://github.com/theme-next/theme-next-pjax
   pjax: false ==> true

在一篇blog中单独插入音乐#

有时只是想分享一首音乐，如果把它放入左下角的背景音乐播放器很难起到良好的安利效果，这时我们就可以单独水发一篇blog来专门安利。

方法一 (此方法恰好在检查这篇blog时发现有致命bug，暂无解决方案，慎用)

首先我们需要安装插件 hexo-tag-aplayer
$ npm install --save hexo-tag-aplayer
然后在blog的markdown文件中插入如下代码在希望出现音乐播放器的地方。
{% meting "1959535653" "netease" "song" "theme:#555" "mutex:true" "listmaxheight:340px" "preload:metadata" "autoplay:false" %}
具体的参数调整可以移步参考内容中的Hexo主题插入音乐之aplayer音乐播放器

方法二 (利用我们已经在线加载的aplayer插件和metingjs插入播放器)

将下列代码插入markdown文件中你想要的位置就可以了，具体参数配置和之前的是一样的，这里有一个官方DOCS的传送门(〃’▽’〃)。
<meting-js
      server = "netease"
      id = "1959535653"
      type = "song" 
      mini = "false">
</meting-js>

HEXO脚注#

正是在写这篇博客的过程中，我发现markdown中的脚注语法无效;起初还怀疑是我阅读的markdown语法教程过时，事实似乎是因为hexo并不原生支持渲染markdown的脚注，所以需要我们安装一个简单的 Reference 插件完成脚注功能。

 npm install hexo-reference --save

markdown的脚注语法⁶在这里就不赘述了。

设置背景图片#

没想到吧，╮(─▽─)╭ ，设置背景图片居然无法在next的配置文件里完成，而且网上盛传的新建stlyes文件夹的方法根本用不了，只会导致页面排版错乱。所以实际上想要给next主题设置背景图片需要我们去修改目录 \themes\next\source\css\_schemes 下的scheme文件夹中的 index.html 文件（这取决于你选择的scheme，比如我选择了Gemini）。

准备好你的背景图片⁷，放在目录 \themes\next\source下的任意文件夹中（实际上我建议放在目录 \themes\next\source\images 下）。
打开目录 \themes\next\source\css\_schemes 下的scheme文件夹中的 index.styl 文件，并作出如下修改
body { 
background: url(/images/background6.jpg); // background6.jpg是我的背景图片的全称（注意带上文件类型后缀）
background-repeat: no-repeat; // 设定背景图片非重复填充
background-attachment: fixed; // 设置背景图片不随页面滚动
background-position: 50% 50%; // 设置背景图片位置
background-size: cover // 设置背景图片大小
}

POSTpage中的按钮只能指向第一个blog#

我不知道这是不是一个个例问题，但是我觉得任何碰上的人都绝对很绝望（比如我(T＿T)。。。），所以还是在这里写一下解决办法。先说好，我并不知道其中原理（菜☹），我只是通过观察别人的配置试错得出的解决办法，如果有人明白其中原理，还请加我的QQ或WeChat赐教（在sidebar底端）。

问题似乎出在hexo的配置文件中的配置选项 permalink ，如下。

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://zivmax.top
permalink: title/    <== 问题在这儿！！！
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks

当我将其改为如下时，问题得到解决。

 permalink: :year/:month/:day/:title/

小记#

这是我的第一篇技术博客，~~虽然我其实没有任何技术~~，实际上呢光是在写这篇博客的过程中就发现很多问题（如第二个和第四个问题），甚至是发布前都能发现bug。。。然后在总结内置aplayer播放器的过程中，我又成功发现插件插入位置的奥秘，优化了我的内置播放器，当然这些也让写这篇博客的70%时间流走 ╮(─▽─)╭ 。

实际上我已经到达了SHTU小四天，不会忘记建立博客的目的之一就是完整展示SHTU的本科生活，为自己留下一些纪念，也让之后的高考生在报考时有一个完整的参考（虽然可能主观且有限，但贵在完整）。

大概每周会对SHTU的生活进行一次总结并更新博客，希望自己能坚持下去吧

对于博客网站建设本身的规划如下

图床搭建（90%）
歌单页面搭建（30%）
使网站能被google和百度（1%）

大概下一次有关搭建博客网站的内容会是CDN加速？说实话我现在ssl证书的问题都还没有解决(T＿T)，下次更新前我至少先解决这个问题吧。

最后推荐首歌（以后每个blog大概都会有推荐）

参考内容#

尤其在移动端，几乎是必拦截自动的音视频播放。 ↩
意味着可以使用网易云以外的平台（然而我还没能用别的平台成功过(╬￣皿￣)），但是对于VIP歌曲只能播放30s。 ↩
当然，我觉得是我的问题，也许我的hexo配置出错或者DOCS没理解。 ↩
个人只测试过这两个文件，理论上，只要是点开网站就会执行的文件，就可以把请求代码放在里面。 ↩
关注源码中关键词如 endif body head 等。 ↩
我是在菜鸟教程上面学的markdown语法。 ↩
我的背景图片来自NASA-哈勃望远镜(ﾟ▽ﾟ*)♪。 ↩