Hexo Blog 教程

发表于 | 更新于 | 分类于 | 阅读次数：
Hexo v3.8.0 NexT v6.4.2博客搭建流程

安装及部署

初始化

1
$ hexo init [folder]

新建文章

1
$ hexo new [layout] <title>

如果没有设置layout，默认使用config.yml中的defaultlayout参数代替。如果标题包含空格，请使用引号括起来。

生成静态网页

1
$ hexo generate

可以简写成

1
$ hexo g

启动服务

1
$ hexo server

启动服务器。默认情况下，访问网址为： http://localhost:4000/。

部署

首先，修改站点位置文件,文件位于项目根路径下_config.yml文件，

1
2
3
4
deploy:
  type: git
  repo: "仓库路径"
  branch: master

这里注意:后一定要有一个空格，否则部署无反应。

然后，安装Hexo-git

1
$ npm install hexo-deployer-git --save

执行部署命令：

1
$ hexo deploy

该命令请在git中执行。 部署网站，可以简写为

1
$ hexo d

发布部署说明

  • hexo 分支:hexo笔记源代码
  • master 分支:hexo笔记访问分支
  • jekyll分支:之前博客文章备份
    源码文件夹一直处于hexo分支，直接修改博客，然后修改。源文件直接commit到hexo分支。
    部署直接git cmd使用
    1
    2
    3
    hexo clean
    hexo g
    hexo d

hexo已追踪文件及文件夹:

  • .gitignore
  • _config.yml
  • source/
  • theme/next/_config.yml
  • scaffolds/

个性化配置

更换主题

  1. 下载主题：

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

  2. 配置主题：
    修改站点默认主题

    1
    theme: next

可以选择修改样式.打开主题配置文件(next/_config.yml)，选择以下即可：

1
2
3
4
#scheme: Muse
#scheme: Mist
scheme: Pisces
#scheme: Gemini

网站信息

打开站点配置文件_config.yml，修改对应文字即可：

1
2
3
4
5
6
7
# Site
title: Hexo
subtitle:
description:
author: John Doe
language:
timezone:

Next的使用以后再调整

文章标签

首先创建tag页面：

1
$ hexo new page tags

修改source/tags/index.md文件，添加type: "tags"：

1
2
3
4
5
---
title: tags
date: 2018-10-24 21:25:58
type: "tags"
---

修改模板文件scaffolds/post.md,添加一行’tags:’:

1
2
3
4
5
6
7
---
title: {{ title }}
date: {{ date }}
tags:
categories:
description:
---

给文章添加tags,在文章开头填写tags，格式如下：

1
2
3
tags: 
- Hexo 
- Github Page

文章分类

同创建标签步骤基本一致，首先创建分类页面：

1
$ hexo new page categories

然后修改source/tags/index.md文件，添加type: "tags"：

1
2
3
4
5
---
title: tags
date: 2018-10-24 21:25:58
type: "categories"
---

最后在文章添加分类：

1
2
3
4
5
6
7
8
9
---
title: Hexo教程
date: 2018-10-24 18:14:18
tags: 
- Hexo 
- Github Page
categories: other
description: Hexo建站流程说明
---

阅读统计

阅读次数统计（LeanCloud） 由 Doublemine 贡献
请查看为NexT主题添加文章阅读量统计功能

文章搜索

Hexo NexT 6.0+版本

Algolia教程
1.登陆注册Algolia,创建Index。详细步骤参考6.0以下或教程。
2.安装

1
$ npm install --save hexo-algolia

3.修改站点配置文件:

1
2
3
4
5
algolia:
  applicationID: 'Application ID'
  apiKey: 'Search-only API key'
  indexName: 'indexName'
  chunkSize: 5000

4.创建环境变量，Win下可直接手动创建。

1
2
3
4
$ export HEXO_ALGOLIA_INDEXING_KEY=Search-Only API key # Use Git Bash
# set HEXO_ALGOLIA_INDEXING_KEY=Search-Only API key # Use Windows command line
$ hexo clean
$ hexo algolia

完成后执行hexo algolia,得到结果：

1
2
3
4
5
INFO  [Algolia] Testing HEXO_ALGOLIA_INDEXING_KEY permissions.
INFO  Start processing
INFO  [Algolia] Identified 9 pages and posts to index.
INFO  [Algolia] Indexing chunk 1 of 1 (50 items each)
INFO  [Algolia] Indexing done.

5.安装依赖包。(可以选择修改CDN，参考教程)

1
2
$ cd themes/next
$ git clone https://github.com/theme-next/theme-next-algolia-instant-search source/lib/algolia-instant-search

6.修改站点位置文件，启用搜索

1
2
3
4
5
6
7
8
9
# Algolia Search
algolia_search:
  enable: true
  hits:
    per_page: 10
  labels:
    input_placeholder: Search for Posts
    hits_empty: "We didn't find any results for the search: ${query}"
    hits_stats: "${hits} results found in ${time} ms"

7.配置URL
修改站点配置文件，将url设置为/(或域名),防止出现搜索结果跳转链接域名为http;//yoursite:

1
2
3
4
5
6
7
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
#url: http://yoursite.com
url: /
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

Hexo NexT 6.0以下版本

1.安装hexo-generator-searchdb：

1
$ npm install hexo-generator-searchdb --save

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

1
2
3
4
5
search:
  path: search.xml
  field: post
  format: html
  limit: 10000

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

1
2
3
4
5
6
7
local_search:
  enable: true

...

algolia_search:
  enable: true

4.启用Algolia：
4.1创建APIKeyHEXO_ALGOLIA_INDEXING_KEY

  • 进入Algolia的API Keys页面ALL API KEYS选项卡
  • 创建APIKey
    • Description：HEXO_ALGOLIA_INDEXING_KEY
    • Indices：<此处选择之前创建的Index>
    • ACL：Add records，Delete records，List indices，Delete index
      4.2设置环境变量HEXO_ALGOLIA_INDEXING_KEY,可手动添加
      1
      $ export HEXO_ALGOLIA_INDEXING_KEY=<此处为第1步创建的APIKey>

4.3修改站点配置文件，添加以下内容：

1
2
3
4
5
6
# Add manual - algolia:
algolia:
  applicationID: '你的Application ID'
  apiKey: '你的Search-Only API Key'
  indexName: '输入刚才创建index name'
  chunkSize: 5000

官方教程中未添加apikey列，导致可能失败。参考Github上教程

4.4安装模块

1
2
$ cd themes/next
$ git clone https://github.com/theme-next/theme-next-algolia-instant-search source/lib/algolia-instant-search

4.5配置URL
修改站点配置文件，将url设置为/,防止出现搜索结果跳转链接域名为http;//yoursite:

1
2
3
4
5
6
7
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
#url: http://yoursite.com
url: /
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

4.6执行Algolia命令

1
2
3
4
5
6
$ hexo algolia
INFO  [Algolia] Testing HEXO_ALGOLIA_INDEXING_KEY permissions.
INFO  Start processing
INFO  [Algolia] Identified 9 pages and posts to index.
INFO  [Algolia] Indexing chunk 1 of 1 (50 items each)
INFO  [Algolia] Indexing done.

文章公式

首先卸载默认渲染器，如遇到错误可忽略。

1
$ npm un hexo-renderer-marked --save

然后安装新的渲染器

1
$ npm i hexo-renderer-kramed --save

修改主题配置文件,开启公式支持

1
2
3
4
5
math:
  enable: true
  ...
  engine: mathjax
  #engine: katex

最后注意，在文章顶部为当前文章开启渲染支持

1
2
3
4
5
6
---
title: 文章名称
date: 2018-10-24 18:14:18
mathjax: true
...
---

Hexo文章公式使用注意

  • 先写下标，再写上标，否则可能无法编译。$X_1^2$-$X^2_1$-$X_1^2$
  • {}的转义不是\{\}，而是\\{\\}: $\{\}$
  • 公式换行\\转义为\\\\:
    $$
    \begin{cases}
    1 \\
    2 \\
    3 \\
    \end{cases}
    $$
  • 表头前要有一行空白，否则编译失败
  • * 需要转义为\*：$*$
  • <t>需要转义<t\>: $x^{<t>}$

请注意：
mathjax的编译，请选择不同cdn。

1
2
3
4
5
6
7
8
9
10
11
12

## 底部标签 ##
将文章底部的标签由`#`改为<i class="fa fa-tag"></i>  
打开`/themes/next/layout/_macro/post.swig`，搜索`rel="tag">#`  
将`#`改为`<i class="fa fa-tag"></i>`


## 谷歌收录 
创建站点地图

``` bash 
npm install hexo-generator-sitemap --save

在站点配置文件中添加以下内容：

1
2
3
4
5
# 自动生成sitemap
sitemap:
  path: sitemap.xml
  #baidusitemap:
  #path: baidusitemap.xml

修改站点配置文件中的url：

1
url: https://nocater.github.io

执行hexo d部署后，访问https://nocater.github.io/sitemap.xml，检查其中是否包含域名：

1
2
3
4
5
6
7
8
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>
      https://nocater.github.io/2018/10/24/Hexoj%E5%BB%BA%E7%AB%99%E6%95%99%E7%A8%8B/
    </loc>
    <lastmod>2018-10-26T06:46:34.000Z</lastmod>
  </url>
<url>

验证通过后，就可以开始配置Google了：

  • 在谷歌搜索引擎入口提交博客网址
  • 选择文件验证，下载html文件后，在源码里添加
    1
    2
    3
    ---
    layout: false
    ---

禁止Hexo的模板渲染。部署成功并访问成功后，就可以通过验证了。

百度收录

提交网址与提交链接实现与Google类似。
不过站点地图可选择：

  • 主动推送
  • 自动推送 可直接修改主题配置文件，将baidu_push: false设置为ture。
  • sitemap(Google中使用此方法)

参考

$e=mc^2$
Hexo官方文档
NexT官方教程