Skip to main content
LisibleDocumentation
Live previewer

Customize

Internationalization

Maintain truly bilingual routes, content, interfaces, metadata and exports.

Lisible uses Astro’s native i18n routing: French documentation routes have no prefix and English routes live under /en/.1 The canonical landing pages live at /fr/ and /en/. The x-default / entry is the exception: its default HTML is English.

astro.config.ts
i18n: {
locales: ["fr", "en"],
defaultLocale: "fr",
}

Four layers to translate

  1. Content: mirrored files in shared/content/blog/fr and en.
  2. Interface: typed dictionaries in every variant.
  3. Routes: equivalent wrappers and URLs.
  4. Invisible outputs: SEO, RSS, errors, llms.txt and exported Markdown.

Build URLs

Use astro:i18n helpers instead of manual concatenation. They respect the default locale and routing options.2

import { getRelativeLocaleUrl } from "astro:i18n";
const englishBlog = getRelativeLocaleUrl("en", "blog");

Language switcher

On a post, it points to the mirrored file with the same basename. When no translation exists, it falls back to the target locale index instead of creating a dead link.

A click stores lisible-locale, then ClientRouter performs the transition without a full reload. Documentation pages and the /fr/ or /en/ landing keep the requested URL as their source of truth. The / entry serves English by default, then applies French inside the same document before it becomes visible when either the stored choice or the browser’s first recognized FR/EN language is fr: there is no navigation, reload or English flash. The 404 applies the same choice directly to its content. Astro’s defaultLocale: "fr" describes the shape of unprefixed documentation URLs.

Hreflang and document language

Every page needs the correct <html lang>, fr, en and x-default alternates, plus matching OpenGraph locales. Pagefind also uses lang to segment its index.

Audit

  • compare French and English file sets;
  • compare frontmatter keys;
  • search for hard-coded strings in components;
  • verify /, /fr/, /en/, feeds and llms.txt on the served build;
  • confirm that switching FR/EN keeps the same client document and persists across navigation;
  • inspect canonical and hreflang in final HTML.

See Content model for mirrors and SEO, feeds and text exports for secondary outputs.

References

Footnotes

  1. Astro applies the prefix according to defaultLocale and the configured routing strategy.

  2. Helpers also account for settings such as base and trailingSlash.

Documentation maintained with LisibleEdit this page ↗

Actions

Search for an API, a command or a concept.