优化 Hexo 的永久链接

优化 Hexo 的永久链接

前言

Hexo 默认永久链接是 :year/:month/:day/:title/ 这样的格式,比如新建一篇标题为 「hello world」的文章,其永久链接就是:http://example.com/2021/06/16/hello-world/ ,这样的目录层级太复杂,深度太大,不仅不利于 SEO,而且也不好看😷

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

  1. 『免插件』修改 Hexo 的配置文件 permalinks 字段格式并在文章 front-matter 部分进行定义
  2. 『插件式』安装 hexo-abbrlinkhexo-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  # 网址
permalink: :year/:month/:day/:title/    
permalink_defaults:      # 默认永久链接
pretty_urls:             # 美化永久链接
  trailing_index: true   # 设置为false,以删除永久链接结尾的'index.html'部分
  trailing_html: true    # 设置为false,以删除永久链接结尾的'.html'部分
  • url: 填带协议的网站地址,比如 http://example.com
  • permalink: 预设永久链接格式
  • trailing_index: 是否显示页面永久链接结尾的 index.html 部分
  • trailing_html: 是否显示文章永久链接结尾的 .html 部分

免插件式

文章结尾带 .html

文章结尾带 .html 更像一个静态网页,有些人可能更加喜欢,打开 Hexo 的配置文件:

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://www.dejavu.moe  # 修改此处为实际的网站地址
permalink: :permalink        # 修改此处
permalink_defaults:
pretty_urls:
  trailing_index: true
  trailing_html: true

然后在文章头部的 front-matter 部分增加一个字段:permalink: ,并在后面写上实际的永久链接,比如本文:

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

那么本文的永久链接就是:https://www.dejavu.moe/posts/hexo-permalinks.html

文章结尾不带 .html

文章结尾不带 .html 更为简洁,我个人也更加喜欢,打开 Hexo 的配置文件:

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://www.dejavu.moe  # 修改此处为实际的网站地址
permalink: :permalink        # 修改此处
permalink_defaults:
pretty_urls:
  trailing_index: true
  trailing_html: true

然后在文章头部的 front-matter 部分增加一个字段:permalink: ,并在后面写上实际的永久链接,比如本文:

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

那么本文的永久链接就是:https://www.dejavu.moe/posts/hexo-permalinks/

为了防止每次在新建文章后忘记在文章的 front-matter 加入这个字段,建议将字段 permalink:字段的配置加入 Hexo 文章模板中,这样每次在 hexo new post “post title” 以后就可以在文章的 front-matter 部分直接修改文章的永久链接,防止忘记。

操作如下:打开 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-abbrlinkhexo-abbrlink2 插件

在 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.dejavu.moe/posts/66c8.html
#crc16 & dec
https://www.dejavu.moe/posts/65535.html
#crc32 & hex
https://www.dejavu.moe/posts/8ddf18fb.html
#crc32 & dec
https://www.dejavu.moe/posts/1690090958.html

当然,你也可以在文章的 front-matter 部分手动定义 abbrlink 字段的值,比如:

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

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

或者:https://www.dejavu.moe/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.dejavu.moe/posts/1.html
https://www.dejavu.moe/posts/2.html
https://www.dejavu.moe/posts/3.html

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

上面的几种方法选一种即可,博主 目前使用的是 免插件式 方法🍭

作者

Dejavu

发布于

2020-06-07

更新于

2021-06-25

许可协议

评论