使用Hexo搭建个人网站点滴记录

注：本文是以hexo的next主题为例进行配置的。

从0到1搭建过程

看这一篇就够了：GitHub+Hexo 搭建个人网站详细教程

---

图床——七牛云

写博客、写文章的时候，不免经常会用到很多图片，也偶尔会用到一些音频、视频等，这些东西总不能都push到github吧，所以寻找一个好用的存放这些静态资源的平台就比较有现实意义了。

七牛云就不错，我平时使用七牛云的对象存储服务存储图片、音频和视频，有10GB的免费存储空间。

七牛云使用注意点

缓存更新

当修改了对象存储空间中的图片等资源后（重命名、删除等），因为缓存机制，更新是不会立即生效的，如果想立即生效，需要这样去手动刷新：管理控制台--->融合CDN--->刷新预取--->刷新文件--->填入要刷新的资源的URL--->点击"提交"按钮，即可。

---

页面个性化设置

加上Fork me on GitHub按钮

打开文件：blog\themes\next\layout\_layout.swig（注：blog为hexo博客所在的根目录，下同），找到下面这两行内容：

在

这一行的下方添加一行a标签代码即可：

注：a标签的href属性即为你的GitHub地址，内部的img标签是按钮的样式。

添加背景音乐

参考：
https://blog.csdn.net/foradawn/article/details/78941992
https://www.tiexo.cn/aplayer/

先打开blog\themes\next\layout\_macro\sidebar.swig文件，找到class属性值为site-overview的section标签。

方式一：七牛云存储音乐文件链接

在section标签的最尾部添加如下HTML代码：

其中http://xxx.bkt.clouddn.com/xxx.mp3为事先存储在七牛云上的歌曲mp3文件的外链地址。

这个方式的优点是方便，缺点是不能灵活地控制歌曲的播放模式，播放器也不美观。

方式二：网易云音乐外链

在网易云音乐搜素到想要的歌曲，然后点击"生成外链"按钮，把生成的外链的HTML代码添加到section标签的尾部，比如：

方式三（推荐）：使用aplayer播放器

在section的尾部添加如下代码：

最后一个div标签就是播放器的代码，支持的几个属性介绍（粗体为必填项）：

• data-id: 歌曲/专辑/歌单ID

• data-server: 音乐平台，支持如下参数：
  netease （网易云音乐）
  tencent （qq音乐）
  xiami （虾米音乐）
  kugou （酷狗音乐）
  baidu （百度音乐）

• data-type: 请求类型，支持如下参数：
  song （单曲）
  album （专辑）
  playlist （歌单）
  search （搜索）

• data-mode: 播放模式，支持如下参数：
  random （随机）
  single （单曲）
  circulation （列表循环）
  order （列表）

• data-autoplay: 自动播放 ，支持如下参数：
  true
  false

---