Aller au contenu principal
LisibleDocumentation
Previewer en direct

Personnaliser

Internationalisation

Maintenir des routes, contenus, interfaces, métadonnées et exports réellement bilingues.

Lisible utilise le routage i18n natif d’Astro : les routes documentaires françaises sont sans préfixe et les routes anglaises sous /en/.1 Les landings canoniques vivent sous /fr/ et /en/. L’entrée x-default / constitue l’exception : son HTML par défaut est anglais.

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

Quatre couches à traduire

  1. Contenu : fichiers miroirs dans shared/content/blog/fr et en.
  2. Interface : dictionnaires typés de chaque variante.
  3. Routes : wrappers et URLs équivalentes.
  4. Sorties invisibles : SEO, RSS, erreurs, llms.txt et Markdown exporté.

Construire les URLs

Utilisez les helpers astro:i18n plutôt qu’une concaténation manuelle. Ils respectent la locale par défaut et les options de routage.2

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

Sélecteur de langue

Sur un article, il pointe vers le fichier miroir de même basename. Si la traduction n’existe pas, il revient à l’index de la locale cible plutôt que de générer un lien mort.

Le clic enregistre lisible-locale, puis ClientRouter effectue la transition sans rechargement complet. Sur les pages documentaires et les landings /fr/ ou /en/, l’URL demandée reste la source de vérité. L’entrée / sert l’anglais par défaut, puis applique le français directement dans le même document avant son affichage si le choix enregistré ou la première langue FR/EN du navigateur vaut fr : aucune navigation, aucun rechargement et aucun flash de l’anglais. La 404 utilise le même choix directement dans son contenu. Le defaultLocale: "fr" d’Astro décrit la forme des URLs documentaires sans préfixe.

Hreflang et langue du document

Chaque page doit avoir le bon <html lang>, les alternates fr, en, x-default et les locales OpenGraph correspondantes. Pagefind utilise aussi lang pour segmenter son index.

Audit

  • comparez les ensembles de fichiers FR/EN ;
  • comparez les clés de frontmatter ;
  • cherchez les chaînes en dur dans les composants ;
  • vérifiez /, /fr/, /en/, les flux et llms.txt sur le build servi ;
  • confirmez qu’un changement FR/EN conserve le même document côté client et persiste après navigation ;
  • inspectez les canonical et hreflang dans le HTML final.

Voir Modèle de contenu pour les miroirs et SEO, flux et exports texte pour les sorties secondaires.

Références

Footnotes

  1. Astro applique le préfixe selon defaultLocale et la stratégie de routage configurée.

  2. Les helpers tiennent aussi compte de paramètres tels que base et trailingSlash.

Documentation maintenue avec LisibleModifier cette page ↗

Actions

Recherchez une API, une commande ou un concept.