Hexo博客框架搭建记录

安装Nodejs

下载

官网地址

检查安装结果

npm -v

安装Hexo

使用npm全局安装npm install hexo-cli -g
附上官网链接https://hexo.io/zh-cn/

初始化博客

命令行进入（你希望）博客存储目录
hexo init BlogName(此处为目录名称)
hexo s 运行

更换主题

下载主题

此处选择Butterfly主题，更多主题请查看Hexo官网
在博客根目录执行 git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

更换主题

修改 HexoRoot/_config.yml 中的theme项为Butterfly

配置博客

Page Front-matter

---
title:
date:
type: (tags,link,categories這三個頁面需要配置)
comments: (是否需要顯示評論，默認true)
description:
top_img: (設置頂部圖)
mathjax:
katex:
aside:
---

Post Front-matter

---
title:
date:
tags:
categories:
keywords:
description:
top_img: (除非特定需要，可以不寫)
comments  是否显示评论，默认true
cover:  缩略图
toc:  是否顯示toc (除非特定文章設置，可以不寫)
toc_number: 是否顯示toc數字 (除非特定文章設置，可以不寫)
copyright: 是否顯示版權 (除非特定文章設置，可以不寫)
mathjax:
katex:
hide:
---

创建标签页

前往HexoRoot
输入hexo new page tags
会生成source/tags/index.md文件
修改这个文件为

---
title: 标签
date: 2020-04-09 16:13:50
type: "tags"
---

创建分类页

前往HexoRoot
输入hexo new page categories
会生成source/categories/index.md文件
修改这个文件为

---
title: 分类
date: 2020-04-09 16:13:50
type: "categories"
---

创建友链页

前往HexoRoot
输入hexo new page link
会生成source/link/index.md文件
修改这个文件为

---
title: 分类
date: 2020-04-09 16:13:50
type: "link"
---

友情链接配置
1. 创建source/_data目录
2. 创建link.yml 文件
3. 修改link.yml 文件内容

class:
  class_name: 友情鏈接
  link_list:
    1:
      name: xxx
      link: https://blog.xxx.com
      avatar: https://cdn.xxxxx.top/avatar.png
      descr: xxxxxxx
    2:
      name: xxxxxx
      link: https://www.xxxxxxcn/
      avatar: https://xxxxx/avatar.png
      descr: xxxxxxx  

 class2:
   class_name: 鏈接無效
   link_list:
     1:
       name: 夢xxx
       link: https://blog.xxx.com
       avatar: https://xxxx/avatar.png
       descr: xxxx
     2:
       name: xx
       link: https://www.axxxx.cn/
       avatar: https://x
       descr: xx

创建音乐页

音乐界面使用了插件 hexo-tag-aplayer。
使用方法請參考插件的文档。
音乐页面只是普通的 page 頁，按普通页面操作生成就行。

注意：此处可能会出现错误
extends includes/layout.pug block content include includes/recent-posts.pug include includes/partial
原因为hexo-tag-aplayer缺少依赖
执行npm install --save hexo-renderer-jade hexo-generator-feed hexo-generator-sitemap hexo-browsersync hexo-generator-archive
可以解决

创建电影页

电影界面使用了插件 hexo-douban。
使用方法请参考插件的文档。

注意：hexo-douban 会自动生成頁面，所以不需要自己创建。对应页面的 top_img 可以 butterfly.yml 修改。

优化文章链接过长问题

使用hexo-abbrlink 插件
修改_config.yml permalink: :abbrlink.html
添加

# Other
# abbrlink config
abbrlink:
  alg: crc16  #support crc16(default) and crc32
  rep: hex    #support dec(default) and hex

修改自定义域名

在项目source文件夹下创建CNAME文件，内容写域名
将域名解析到{username}.github.io

部署到Github

修改配置文件（_config.yml）

deploy:
  type: git
  repo: git@github.com:yourname/youname.github.io.git #根据具体情况输入
  branch: master

配置GitHub

打开GitHub new repository 创建一个你的项目，项目名yourname.github.io (yourname需要跟GitHub用户名一致)
打开Setting -> GitHub Pages 开启你的pages

配置本地Git

1 2	$ git config --global user.name "xxxx" $ git config --global user.email "xxxxx@xx.com"

部署

HexoRoot 下执行 hexo g -d
注意：此处可能会出现error deployer not found:git，原因为缺少hexo-deployer-git插件，
执行npm install hexo-deployer-git --save可以解决

备注

文中HexoRoot表示博客根目录
简要信息过短可以使用  占位