Hexo 实现优化文章标题中文字符


Hexo 创建文章标题

命令设置文章标题

Hexo 新建一篇博客文章时使用如下命令

hexo new [layout] 'titleName'
  • layout 是一个可选参数,用来指定创建文章对应的布局,即文章最终会被分配到的文件夹路径
    • layout 参数有三种默认布局:post、page 和 draft,
    • post,默认类型,创建时文章会储存到 source/_posts 文件夹
    • page,创建时文章会储存到 source 文件夹
    • draft,代表博客草稿,创建时文章会储存到 source/_drafts 文件夹
    • 另外,也可以根据 Hexo 的结构和主题自定义创建一些布局
  • titleName 是必填参数,代表创建文章的文件名及链接地址名称

根据时间分类管理文章

Hexo 默认以标题做为文件名称,但您可编辑 new_post_name 参数来改变默认的文件名称,举例来说,设为 :year-:month-:day-:title.md 可让您更方便的通过日期来管理文章。
变量 | 描述 |
| ———- | ——————– |
| :title | 标题(小写,空格将会被替换为短杠) |
| :year | 建立的年份,比如, 2015 |
| :month | 建立的月份(有前导零),比如, 04 |
| :i_month | 建立的月份(无前导零),比如, 4 |
| :day | 建立的日期(有前导零),比如, 07 |
| :i_day | 建立的日期(无前导零),比如, 7 |

Front-matter 设置文章标题

Hexo 中 Front-matter 是文件最上方以 --- 分隔的区域,用于指定文件的变量数据。

---
title: blog's title
date: 2023/06/30 20:46:25
---
  • title 代表当前文章的标题
    因此除了使用 hexo new <title> 参数创建指定名称的文章外,还可以在文件夹中自定义创建 .md 文件,并在内容中定义对应的 title 属性。

需要注意的是,对于文件名称和 Front-matter 中 title 内容不一致时有:

  • 文件名称作为 Hexo 默认的文件地址链接,名称改变后地址随之变化
  • title 代表文章内容的标题
  • 使用命令指定 title 时默认文件名称和内容标题一致

自定义模板 Front-matter

Hexo 提供了模板文件供创建文章时使用,可以在 scaffolds 文件夹下创建对应的模板文件,然后在 hexo new [layout] <title> 命令中使用模板文件名称代替 layout 参数,既可以按照模板文件内容创建指定文件。

详细模板文件使用可见官网链接:模版(Scaffold)

文章标题(路径)为中文的问题

由于语言使用习惯,我们在创建 Hexo 文章时更喜欢使用中文来定义文章标题,Hexo 创建博客文章时使用中文作为作为页面的标题,会默认以该标题名作为文章的的 url,这样就会导致在网页中 name 为中文,因此在页面文章的 SEO 中会出现如下问题:

  1. 搜索引擎收录文章地址不友好
  2. 分享或复制文章地址时可能会对中文进行 url 编码,导致地址乱码
  3. 文章标题发生变更时,文章访问地址也会改变,导致已分享的地址不可用

文章标题 SEO 优化

对于文章 SEO 问题,其实只需要做到两点即可:

  1. 将文章链接地址编码成非中文地址,这也在搜索引擎收录和分享地址时不会出现问题
  2. 开启 Hexo 设置文章地址为永久地址,这样就不会跟随文章标题发生变更

简单的路径与标题分离

由于文件名称和文章标题可以分开定义,因此可以在创建 .md 文件时名称定义为非中文字符,而在文章的 Front-matter 内容中使用 title 定义中文名称,这样可以避免文章路径为中文导致的问题。

  • 但是这样仍然不可避免在文件名称改变时导致的原始链接不可用

设置文章地址永久有效

为了避免文章名称改变导致链接地址发生变化,Hexo 官方提供了设置文件链接地址为永久有效的方法。
在站点配置文件_config.yml 中使用 permalink 属性配置文章的永久链接。

permalink: :year/:month/:day/:title
  • 上述配置即代表文章生成后永久链接格式为:年/月/日/名称,如果不希望显示时间也可以仅设置为 title

配置文件 permalink 代表没有其他配置时的默认配置,如果在文章的 Front-matter 中进一步设置了 permalink 属性,则会优先使用 Front-matter 中配置的内容。

  • 如果每篇文章中 permalink 有值,则使用文章中的 permalink 作为文章的永久链接
  • 如果文章没有设置 permalink 的值,默认以站点配置文件中 permalink 的格式生成文章的永久链接

最后,相同的是,Front-matter 中可以设置 permalink,则也可以在 scaffolds 对应的模板文件中设置文章创建使用的模板属性值。

文章标题(地址)转数字

Hexo 博客文章可以使用 abbrlink 插件实现链接地址转数字,使用流程如下:

  1. 在项目目录下使用命令安装 abbrlink 插件
    npm install hexo-abbrlink --save
  2. 在 Hexo 配置文件中配置文章地址格式和 abbrlink 插件参数
    #permalink_defaults:
    permalink: posts/:abbrlink/  
    abbrlink:  
      alg: crc32 #support crc16(default) and crc32  
      rep: dec   #support dec(default) and hex
  • alg 是 abbrlink 插件提供的算法
  • rep 是一种散射编码方式
  1. 设置完成后,使用 hexo new <title> 创建新文章时会在文章的 Front-matter 中自动生成 abbrlink 属性值,并将其作为地址链接的内容,这样在文件名称修改后仍然保持有效。

hexo-number-title

除此之外,还有hexo-number-title 也是将中文转为数字链接地址,只不过是根据创建文章时的时间戳来代替。

文章标题(地址)转拼音

Hexo 文件地址中文转拼音是比较符合国人口味的一个插件,其开源地址为hexo-permalink-pinyin
使用方法如下:

  1. 安装插件
    npm i hexo-permalink-pinyin --save
  2. 配置插件
    permalink_pinyin:
    enable: true             # Enable this plugin
    separator: '-'           # Separator of the slug, default: '-'
    exclude: /ignore_post/   # Regex for which post should skip
  • enable 为开关
  • separator 表示每个汉字拼音之间的连接符合,默认是 ‘-‘
  • exclude 可以指定需要跳过的 post 路径
  1. 配置完成后,正常使用名称生成文章便会将中文地址转为拼音

文章标题(地址)转英文

Hexo 博客地址链接转英文主要是使用 hexo-translate-title 插件来实现。

  1. 本地 Hexo 文件目录下安装 hexo-translate-title 插件
    npm install hexo-translate-title --save
  2. 配置 Hexo 的 _config.yml 配置文件
    permalink: :year/:month:day/:translate_title.html
    translate_title:
    translate_way: google  # google,youdao,baidu_with_appid,baidu_no_appid
    youdao_api_key: '' # Your youdao_api_key
    youdao_keyfrom: xxxx-blog # Your youdao_keyfrom
    is_need_proxy: false     # true | false
    proxy_url: http://localhost:50018 # Your proxy_url
    baidu_appid: '' # Your baidu_appid
    baidu_appkey: '' # Your baidu_appkey
    rewrite: false # is rewrite true | false 
  • :title 修改为:translate_title 即可,前面的路径也可按照自己的要求变更,例如 permalink: blog/:translate_title.html
  • 配置翻译相关内容时需要注意:
    • 如果不需要代理,请将_config.yml 下的 is_need_proxy: true 改为 false。如果设置为 true, 需要设置本地代理地址
    • 目前 google 翻译,youdao 翻译均可直接使用,百度翻译使用 APPID 版本,无 APPID 版本均已完成,APPID 版本需要在百度翻译开放平台 获取 appId
    • 如果不希望百度翻译开发平台的 APP_ID 和 APP_KEY 有泄漏风险,建议在百度翻译开发平台 -> 管理控制台的服务器地址一栏,填写好服务器 IP 即可

文章作者: shone
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 shone !
评论
 上一篇
MySQL 安装十分详细版 MySQL 安装十分详细版
一、Windows 下安装 MySQLhttps://www.runoob.com/mysql/mysql-install.html 二、Linux 下安装 MySQL1. yum 命令安装 MySQL使用 yum 方式安装 MySQL 是
2023-07-02 shone
下一篇 
剑指 Offer 04. 二维数组的查找 剑指 Offer 04. 二维数组的查找
一、题目描述在一个 n * m 的二维数组中,每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序。请完成一个高效的函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数。 示例示例:有二维数组矩阵如下: [
2023-06-26 shone
  目录