用 Hugo 进行博客国际化支持

引言

随着对于信息的浏览增多，往往会有对于其他语言的文章书写需求 (同时现代的作品几乎都是多语言支持)，同时又因为好像自从毕设当时加了个多语言支持，之后做的东西或者设计的东西往往都会想要去进行国际化支持，就最近写的一个相当于练手的东西也整了多语言支持捏 (不过这并不是我想要的效果，太古老了，想做一个现代点的，另外在做啦，希望可以坚持做完)

回过头来看看我的博客，这个陪伴我最久的作品，它还没有国际化，虽然也有一般都是写简体中文文章的原因啦，之前的博客界面部分中文部分英文实际上整的多少有点混乱了，虽然我个人可以看懂，但对于非相关人士可能就会感到疑惑

但原先的 Jekyll 我折腾半天愣是没成功多语言，转向原生支持国际化的 Hugo 啦。不过每个主题都有其特色，这个主题对于分类与标签和上个主题区别很大，之后慢慢修改适应才行

这篇文章写的很潦草吧，主要它的配置貌似很依赖主题，我也几乎都是根据主题的示例改的，所以也没什么好写的我觉得 (因为官方文档也很丰富)

环境

使用 Docker 有 Hugo 的容器，所以环境问题没怎么折腾 (使用的东西可以看这里呢)

创建博客

创建新博客

1
hugo new site blogName

进入目录

1
cd blogName

初始化仓库

1
git init

安装主题，这里使用 hugo-theme-stack 主题，其他同理

1
git submodule add https://github.com/CaiJimmy/hugo-theme-stack/ themes/hugo-theme-stack

配置 hugo.toml 选择主题

1
theme = 'hugo-theme-stack'

预览

1
hugo server

包含草稿 (draft) 的预览

1
hugo server -D

部分修改可能需要清除缓存才能生效 (比如配置项、页面的修改)

1
hugo --cleanDestinationDir

构造网站，默认构造文件在 public 下

1
hugo

多语言支持

在站点配置文件 (我使用 yml 配置) 配置默认语言

1
2
defaultContentLanguage: 'zh-cn' # 默认语言代码
defaultContentLanguageInSubdir: false # 默认语言路径是否带语言代码

然后配置具体语言项目

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
languages:
  zh-cn:
    contentDir: 'content/zh-cn' # 文章在哪个目录
    disabled: false
    languageCode: 'zh-cn'
    languageDirection: 'ltr' # 文章从左到右 (ltr) 还是从右到左 (rtl)
    languageName: '简体中文'
    title: "yexca'Blog"
    weight: 1
  zh-tw:
    contentDir: 'content/zh-tw'
    disabled: false
    languageCode: 'zh-tw'
    languageDirection: 'ltr'
    languageName: '繁體中文'
    title: "yexca'Blog"
    weight: 2

字体国际化: https://blog.yexca.net/archives/240

文章撰写

不同于 Jekyll，Hugo 的文章撰写稍微有点复杂，同时加上国际化支持，使得文章更加复杂 (复杂的好处是自定义程度高)，这点可能根据不同主题不一样，我说下我用的，首先上方语言项目配置指定了文章的目录，需要在 content 创建相应目录，然后该语言的文章就在该目录下写作

同时，指定文章是在哪个目录下，stack 主题配置文件中可以指定

1
2
3
params:
    mainSections:
        - posts

这就表明我简体中文的文章应该放在 content/zh-cn/posts 里，然后还有一些目录是主题指定的，可以看对应主题示例

现在要写创建一个简体中文的新文章可以使用

1
TZ="Asia/Tokyo" hugo new content/zh-cn/posts/test.md

不指定时区的话默认使用 UTC 时间 (虽然可以自己改，但习惯了 Jekyll 自动创建的我觉得自己写时间很麻烦)

文章默认创建模板在 blogName/archetypes 下，可以改为 yml 格式

参考文章

Hugo - Quick start

https://stack.jimmycai.com/guide/

Hugo - Multilingual mode