优化 Hexo 网站的永久链接格式

前言

Hexo 默认的永久链接格式目录层级太复杂，深度太大，不仅不利于 SEO，而且也不美观，本文介绍一下 Hexo 下文章的永久链接优化流程

Hexo 的文章永久链接优化方式主要有两种：

1. 免插件式
   修改 Hexo 的配置文件的 permalinks 部分，然后在文章 Markdown 文件的 front-matter 字段进行定义
2. 插件式
   安装 hexo-abbrlink 或 hexo-abbrlink2 插件并配置

打开 Hexo 的配置文件，找到下列字段按照注释修改

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: http://example.com  # 带协议的网站地址，如 https://www.cdsy.work
permalink: :year/:month/:day/:title/	# 预设永久链接格式  
permalink_defaults:      # 默认永久链接
pretty_urls:             # 美化永久链接
  trailing_index: true   # 设置 false 以删除「页面」永久链接结尾的'index.html'部分
  trailing_html: true    # 设置 false 以删除「文章」永久链接结尾的'.html'部分

免插件式

文章结尾带 .html

文章结尾带 .html 更像一个静态网页，如果你更加喜欢这种格式，可以按照下面修改

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://www.cdsy.work  # 修改此处为实际的网站地址
permalink: :permalink        # 修改此处
permalink_defaults:
pretty_urls:
  trailing_index: true	# 设置 true 以显示「页面」永久链接结尾的'index.html'部分
  trailing_html: true	# 设置 true 以显示「文章」永久链接结尾的'.html'部分

写文章的时候在 Markdown 文件的 front-matter 部分新增字段 permalink:，然后写上实际的永久链接，比如

title: 优化 Hexo 的永久链接
toc: true
permalink: /posts/hexo-permalinks.html # 举个例子
date: 2020-06-07 23:35:40

此时永久链接格式就是 https://www.cdsy.work/posts/hexo-permalinks.html

文章结尾不带 .html

文章结尾不带 .html 更为简洁，如果你更喜欢这种格式，可以按照下面修改

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://www.cdsy.work  # 修改此处为实际的网站地址
permalink: :permalink        # 修改此处
permalink_defaults:
pretty_urls:
  trailing_index: false	# 设置 false 以删除「页面」永久链接结尾的'index.html'部分
  trailing_html: false 	# 设置 false 以删除「文章」永久链接结尾的'.html'部分

在文章 Markdown 文件的 front-matter 新增字段 permalink:，然后写上实际的永久链接，比如

title: 优化 Hexo 的永久链接
toc: true
permalink: /posts/hexo-permalinks/ # 注意这部分
date: 2020-06-07 23:35:40

此时永久链接就是 https://www.cdsy.work/posts/hexo-permalinks/

建议将字段 permalink: 字段的配置加入 Hexo 文章模板中，这样每次使用 Hexo CLI 命令新建的文章都会自动在 front-matter 中加入 permalink: 字段

打开 Hexo 根目录下的 scaffolds 文件夹中的 post.md 文件，并在 front-matter 部分新增字段 permalink: /posts/

title: {{ title }}
date: {{ date }}
updated:
categories: 
tags:
toc: true
permalink: /posts/

每次新建文章后在 /posts/ 后加上自定义的格式就行了，这里的 /posts/ 就是我想对所有文章的一个固定路径，相当于所有文章都是在 /posts/ 文件夹下，当然也可以把它改成你喜欢的其他的路径，比如 /articles/、 /works/…

插件式

优化 Hexo 永久链接格式常用的插件有 hexo-abbrlink 或 hexo-abbrlink2 插件

hexo-abbrlink 插件

在 Hexo 根目录打开终端安装插件

# 使用 npm 安装插件
$ npm install hexo-abbrlink --save
# 使用 yarn 安装插件
$ yarn add hexo-abbrlink

修改 Hexo 的配置文件的 permalink: 字段，比如

permalink: posts/:abbrlink/  #文章结尾不带 .html

# 或者
permalink: posts/:abbrlink.html  #文章结尾带 .html

然后在 Hexo 的配置文件里增加 hexo-abbrlink 插件的配置

# hexo-abbrlink
abbrlink:
  alg: crc32      #支持crc16和crc32算法（默认crc16）
  rep: hex        #支持dec和hex值（默认dec）
  drafts: false   #(true)Process draft,(false)Do not process draft. false(default) 
  # Generate categories from directory-tree
  # depth: the max_depth of directory-tree you want to generate, should > 0
  auto_category:
     enable: true  #true(default)
     depth:        #3(default)
     over_write: false 
  auto_title: false #enable auto title, it can auto fill the title by path
  auto_date: false #enable auto date, it can auto fill the date by time today
  force: false #enable force mode,in this mode, the plugin will ignore the cache, and calc the abbrlink for every post even it already had abbrlink.

默认情况下，在新建文章后，abbrlink 插件会自动使用算法生成唯一的永久链接，比如

#crc16 & hex
https://www.cdsy.work/posts/66c8.html
# crc16 & dec
https://www.cdsy.work/posts/65535.html
# crc32 & hex
https://www.cdsy.work/posts/8ddf18fb.html
# crc32 & dec
https://www.cdsy.work/posts/1690090958.html

也可以在文章的 front-matter 部分手动填写 abbrlink 字段的值

title: 优化 Hexo 的永久链接
toc: true
abbrlink: hexo-permalinks #注意这部分
date: 2020-06-07 23:35:40

本文的永久链接就为 https://www.cdsy.work/posts/hexo-permalinks/ (文章结尾不带 .html)

或 https://www.cdsy.work/posts/hexo-permalinks.html (文章结尾带 .html)

局限性: crc16 算法生成的最大文章数量为 65535，不过这个对绝大多数人都几乎没影响，如果一个 abbrlink 的值已存在，那么它会尝试其他可用的值

hexo-abbrlink2 插件

在 Hexo 根目录打开终端安装插件

# 使用npm安装插件
$ npm install hexo-abbrlink2 --save
# 使用yarn安装插件
$ yarn add hexo-abbrlink2

修改 Hexo 的配置文件的 permalink: 字段，比如

permalink: posts/:abbrlink/  #文章结尾不带 .html

# 或者
permalink: posts/:abbrlink.html  #文章结尾带 .html

在 Hexo 的配置文件里增加 hexo-abbrlink2 插件的配置（可选）

# hexo-abbrlink2
abbrlink:
  start: 100 # 启起始文章id，默认为0 ，可以自定义，比如100

默认情况下，在新建文章后，abbrlink2 插件会自动使用算法生成唯一的永久链接，比如

# 默认起始文章id为0的情况下
https://www.cdsy.work/posts/1.html
https://www.cdsy.work/posts/2.html
https://www.cdsy.work/posts/3.html

#自定义文章起始id为100的情况下
https://www.cdsy.work/posts/101.html
https://www.cdsy.work/posts/102.html
https://www.cdsy.work/posts/1033.html

上面的几种方法选一种即可，小编推荐使用 免插件式 方法