User Interface in your language

The Lean Web Kit has multi-language support built-in. Aside from page content, you can also translate all texts in all UI elements. These are elements like the “Link copied to clipboard” message which appears when you hit the “copy to clipboard” button:

Localised message for “Link copied to clipboard”

Manage translations

To add or edit translations go to CMS > Content > Translations. Here you’ll find a list of all translations by their translation key. These keys are used in the code to connect a translation to a UI element. These keys should therefore only be changed by a developer. You can set the translation valuefor each supported language:

CMS form to edit a translation

Under the hood, the Lean Web Kit uses Vue I18n to localise the UI. Within each translation valueyou can use HTML formatting, pluralization and variable names. For instance in the example above {platform} is a variable name, which a developer can substitute in code using the translation helper: $t('share_on_platform', { platform: 'Twitter' }).

See formatting and pluralization in the Vue I18n docs for more information.