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

前言

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

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

  1. 免插件式

    修改 Hexo 的配置文件的 permalinks 部分，然后在文章 Markdown 文件的 front-matter 字段进行定义

  2. 插件式

    安装 hexo-abbrlink 或 hexo-abbrlink2 插件并配置

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

1
2
3
4
5
6
7
8
# 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,dejavu.moe
permalink: :year/:month/:day/:title/	# 预设永久链接格式  
permalink_defaults:      # 默认永久链接
pretty_urls:             # 美化永久链接
  trailing_index: true   # 设置 false 以删除「页面」永久链接结尾的'index.html'部分
  trailing_html: true    # 设置 false 以删除「文章」永久链接结尾的'.html'部分

免插件式#

文章结尾带 .html#

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

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

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

1
2
3
4
title: 优化 Hexo 的永久链接
toc: true
permalink: /article/hexo-permalinks.html # 举个例子
date: 2024-06-03 23:35:40

此时永久链接格式就是 https://fatpig.cc/article/hexo-permalinks.html

文章结尾不带 .html

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

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

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

1
2
3
4
title: 优化 Hexo 的永久链接
toc: true
permalink: /article/hexo-permalinks/ # 注意这部分
date: 2024-06-03 23:35:40

此时永久链接就是 https://fatpig.cc/article/hexo-permalinks/

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

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

1
2
3
4
5
6
7
title: {{ title }}
date: {{ date }}
updated:
categories: 
tags:
toc: true
permalink: /posts/

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

插件式#

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

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

1
2
3
4
# 使用 npm 安装插件
npm install hexo-abbrlink --save
# 使用 yarn 安装插件
yarn add hexo-abbrlink

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

1
2
3
4
permalink: article/:abbrlink/  #文章结尾不带 .html

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

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# 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 插件会自动使用算法生成唯一的永久链接，比如

1
2
3
4
5
6
7
8
#crc16 & hex
https://fatpig.cc/article/66c8.html
# crc16 & dec
https://fatpig.cc/article/65535.html
# crc32 & hex
https://fatpig.cc/article/8ddf18fb.html
# crc32 & dec
https://fatpig.cc/article/1690090958.html

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

1
2
3
4
title: 优化 Hexo 的永久链接
toc: true
abbrlink: hexo-permalinks #注意这部分
date: 2024-06-03 23:35:40

本文的永久链接就为 https://fatpig.cc/article/hexo-permalinks/ (文章结尾不带 .html)

或 https://fatpig.cc/article/hexo-permalinks.html (文章结尾带 .html)

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

hexo-abbrlink2 插件#

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

1
2
3
4
# 使用npm安装插件
npm install hexo-abbrlink2 --save
# 使用yarn安装插件
yarn add hexo-abbrlink2

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

1
2
3
4
permalink: posts/:abbrlink/  #文章结尾不带 .html

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

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

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

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

1
2
3
4
5
6
7
8
9
# 默认起始文章id为0的情况下
https://fatpig.cc/posts/1.html
https://fatpig.cc/posts/2.html
https://fatpig.cc/posts/3.html

#自定义文章起始id为100的情况下
https://fatpig.cc/posts/101.html
https://fatpig.cc/posts/102.html
https://fatpig.cc/posts/1033.html
  1. 清理旧的链接数据：
    在生成新的链接之前，最好先清理旧的链接数据。可以使用以下命令清理缓存和数据库：
1
hexo clean
  1. 重新生成链接：
1
hexo abbrlink new

这个命令会重新生成所有文章的短链接。

  1. 生成静态文件：

最后，重新生成静态文件并部署：

1
2
hexo generate 
hexo deploy