如何在Blogdown+Hugo Apero主题搭建的网站实现双语发文？

1. 配置站点多语言基础设置 #

在站点根目录的config.toml（或config.yaml）中添加多语言配置，以toml为例：

[Languages]
  [Languages.en]
    title = "你的博客标题"
    languageName = "English"
    weight = 1
    contentDir = "content/en"
  [Languages.fa]
    title = "عنوان وبلاگ شما"
    languageName = "فارسی"
    weight = 2
    contentDir = "content/fa"
    rtl = true  # 开启波斯语从右到左排版

2. 调整内容目录结构 #

• 将已有的英文文章迁移到content/en/posts目录下
• 创建content/fa/posts目录，用于存放波斯语版本的文章
• 同一篇文章的不同语言版本文件名必须一致，比如英文文章是my-first-post.md，波斯语版本也要命名为my-first-post.md，分别放在对应语言的posts目录中

3. 给文章添加关联标识 #

在每篇文章的YAML头部添加语言和关联键，确保Hugo能识别对应翻译：
英文文章示例：

---
title: "My First Post"
date: 2024-05-20T10:00:00Z
language: en
translationKey: "my-first-post"
---

波斯语文章示例：

---
title: "مطلب من اول"
date: 2024-05-20T10:00:00Z
language: fa
translationKey: "my-first-post"
---

translationKey的值两篇文章要完全一致，用来关联同一内容的不同语言版本。

4. 添加语言切换功能 #

Hugo Apero主题默认没有语言切换按钮，需要手动添加：

• 可以在站点的layouts/partials/header.html文件中（如果没有就新建这个文件，覆盖主题的对应模板）加入以下代码：

<div class="lang-switch">
  {{ range .Site.Languages }}
    {{ if ne .Lang $.Site.Language.Lang }}
      <a href="{{ .Permalink }}">{{ .LanguageName }}</a>
    {{ end }}
  {{ end }}
</div>

• 可以自行添加CSS样式调整切换按钮的位置和外观，适配波斯语的RTL布局。

5. 本地测试验证 #

运行blogdown::serve_site()启动本地服务器，检查：

• 英文和波斯语页面是否都能正常访问
• 语言切换按钮是否能正确跳转
• 波斯语内容的排版是否为从右到左

内容的提问来源于stack exchange，提问作者Reza Khoei