Hexo+Next搭建博客

之前用的是Stun主题，现在换个最流行的Next，看看效果如何。
Next官网

Hexo的安装

在磁盘的相应位置建立一个文件夹，更名为“Hexo”（名字无所谓，随便起），然后打开这个文件夹，鼠标右击选择“Git Bash Here”

hexo init  #初始化
npm install -g hexo-cli

Next主题安装

任意位置右键点击Git Bash Here，然后按下面代码进行。或者打开博客根目录，也就是你创建博客的文件夹，右键点击Git Bash Here，再运行下面代码的最后一行即可。

$ cd hexo
$ git clone https://github.com/theme-next/hexo-theme-next themes/next

主题切换：打开hexo根目录下的_config.yml，修改theme为next

Next的更新

如果你已经安装好了，可运行如下代码更新

$ cd themes/next
$ git pull

主题布局选择

在Next主题下，还有四种布局，可在主题文件夹下的_config.yml文件中设置。如果想快速定位到需设置的位置，可快捷键Ctrl+F搜索关键词Scheme

# ---------------------------------------------------------------
# Scheme Settings
# ---------------------------------------------------------------

# Schemes
#scheme: Muse
#scheme: Mist
#scheme: Pisces
scheme: Gemini

这四种布局有什么区别呢？

• Muse
  这里有些例子：LEAFERx、XiaoMo、OAwan。

首页页面

文章页面


没想到打开上面这个博客，还能欣赏到美妙的音乐！

• Mist
  这里有些例子：Jeff、Uchuhimo、ixirong
  
  
• Pisces
  这里有些例子：Vi、Acris、Rainy
  
  
• Gemini
  这里有些例子：Ivan.Nginx、Raincal、dandy
  
  

重装node依赖模块

在用上面主题生成静态网页的时候可能会报错，虽然这样仍能看到生成的静态网页，但为了安全起见，还是重新安装node_modules

rm -rf node_modules
rm package-lock.json
npm cache clear --force
npm install

切换为中文

hexo根目录下修改

language: zh-CN

需要注意的是：zh_CN需要在theme的language文件夹中可找到相应的语言文件。
中文乱码问题：设置中文后，还是乱码，这是因为配置文件_config.yml没有使用utf8编码。所以接下来就要设置文件的编码格式为utf8。
在这里我用pycharm修改：Setting->editor->file encoding->UTF8

设置背景动画

NexT 默认开启动画效果，效果使用 JavaScript 编写，因此需要等待 JavaScript 脚本完全加载完毕后才会显示内容。 如果您比较在乎速度，可以将设置此字段的值为 false 来关闭动画。
编辑 主题配置文件， 搜索 use_motion，根据您的需求设置值为 true 或者 false 即可：

use_motion: true  # 开启动画效果
use_motion: false # 关闭动画效果

NexT 自带两种背景动画效果
编辑 主题配置文件， 搜索 canvas_nest 或 three_waves，根据您的需求设置值为 true 或者 false 即可：
注意： three_waves 在版本 5.1.1 中引入。只能同时开启一种背景动画效果。

canvas_nest: true //开启动画
canvas_nest: false //关闭动画

three_waves: true //开启动画
three_waves: false //关闭动画

搜索服务

Local Search 由 flashlab 贡献
添加百度/谷歌/本地 自定义站点内容搜索

安装 hexo-generator-searchdb，在站点的根目录下执行以下命令：

$ npm install hexo-generator-searchdb --save

编辑 站点配置文件，新增以下内容到任意位置：

search:
  path: search.xml
  field: post
  format: html
  limit: 10000

编辑 主题配置文件，启用本地搜索功能：

# Local search
local_search:
  enable: true

博客部署到gitee

1. 新建gitee仓库blog
2. 部署部署需要安装hexo-deployer-git

npm install hexo-deployer-git --save

3. 修改站点配置文件

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://linpions.gitee.io/blog
root: /blog/
permalink: :year/:month/:day/:title/
permalink_defaults:

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  #  repo: https://github.com/zhengqingya/zhengqingya.github.io # github仓库
  repo: https://gitee.com/zhengqingya/blog # 码云仓库
  branch: master

4. 部署

hexo d