Add a Custom Translation Key

LightNet allows you to add custom translation keys to your site, for example to add a custom text for the navigation or for the homepage. Follow this steps to create and use a custom translation key for your media site:

Tip

If you translate a text only page (e.g. the about page) consider using Markdown files instead of custom translation keys.

1. Add to translation files: Add an entry for your custom translation key to all translation files inside src/translations. For example adding a key to the English translations:

   src/translations/en.yml

   x.hello-world: Hello World

   Choose a unique key (left side of the colon). By convention prefix your custom keys with x.. The key is used to referenced your custom translation in your site.
2. Translate: Make sure the entry is translated correctly for all translation files.
3. Use inside an Astro component: Use the custom translation key in your Astro component. LightNet provides a translation function with Astro.locals.i18n.t. You can use this function to get the translation of your custom key based on the current locale.

   src/pages/[locale]/index.astro

   ---
   import { Page } from "lightnet/components"
   ---
   <Page>
       <h1>{Astro.locals.i18n.t("x.hello-world")}</h1>
   </Page>

   The translation function returns the translation of the key Hello World in the current language. If the key is not found in the translations file, the function returns the value of the default site language’s translations file. If the key is not found, the function throws an Error.

   Tip

   We provide internationalization helpers with the Astro.locals.i18n object. This object additionally gives you access to all locales the defaultLocale and more. You can access the i18n object inside all your .astro files.

4. Use inside configuration or content file: Config options require you to pass the translation key instead of the translated string. For example the title property in the astro.config.mjs file. Check the config reference to see where a translation key is required. Also some content file properties accept translation keys, for example the name of a category can be set to a translation key.