197 từ
1 minute
i18n Translation Tutorial

Translation in Post#

Here is a simple routing illustration for using multi language for posts:

src/content/posts/
├── post-1.md
├── post-2/
├── index.md
└── cover.webp
├── post-3.md
├── ja/
├── post-1.md
└── post-2/
├── index.md
└── cover.webp
└── zh-CN/
└── post-1.md

In root of posts directory, it uses the default language (siteConfig.lang) for posts. Create a new directory for locale tag like ja/, zh-CN, etc. The Markdown filename for post must match across languages to link translation. The system will do the rest.

src/config.ts:

export const siteConfig: SiteConfig = {
lang: "en", // default locale
supportedLangs: ["en", "ja", "zh_CN"], // selected locales in website
};

siteConfig.SupportedLangs list (src/types/config.ts):

export type ConfigLang =
| "en"
| "zh_CN"
| "zh_TW"
| "ja"
| "ko"
| "es"
| "th"
| "vi"
| "tr"
| "id"
| "fr"
| "fa";

Supported Locales:

See posts/translation-example. (Shows English as default, Japanese, and Simplified Chinese for example)

And see ja/posts/guide. (For translation with cover image)

Translation in About & Friends Pages#

The spec content follows the exact same pattern as post

src/content/spec/
├── about.md
├── friends.md
├── ja/
├── about.md
└── friends.md
└── zh-CN/
├── about.md
└── friends.md

See about and friends. (English, Japanese, and Simplified Chinese)


NOTE

rtl (right to left) system for Persian (Farsi) translation not set up properly.

i18n Translation Tutorial
https://iyanarmanda.github.io/kukuru/vi/posts/i18n-tutorial/
Tác giả
Kukuru Misakino
Xuất bản tại
2026-07-24
Giấy phép
CC BY-NC-SA 4.0