Hexo Blog 教程

安装及部署

初始化

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分支,直接修改博客,然后修改。源文件直接commithexo分支。
    部署直接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

  • 进入AlgoliaAPI 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官方教程