mirror of
https://github.com/ToolJet/ToolJet
synced 2026-04-22 14:07:26 +00:00
69 lines
2.9 KiB
Markdown
69 lines
2.9 KiB
Markdown
|
---
|
||
|
|
id: l10n
|
||
|
|
title: Localization
|
||
|
|
---
|
||
|
|
|
||
|
|
Welcome to ToolJet Localization Guide. The goal of the Localization is to make ToolJet easy to use and close to all countries, languages, and general cultural groups. On this page, you will find instructions on how to contribute to ToolJet through Localization and make a more friendly ToolJet for all regions.
|
||
|
|
|
||
|
|
## Adding Translations
|
||
|
|
|
||
|
|
- For adding the translations of your language in ToolJet, you'll need to create a new **languagecode.json** file which will include all the translations for the keywords in your language, and then list the language in the **languages.json** file for the language to be listed in the dashboard of the ToolJet.
|
||
|
|
|
||
|
|
- Go to the **frontend** directory which is at the root of ToolJet, then go to the **assets** and inside assets, you'll find the **translations** directory. You have created a new json file with the **language code** as the file name. The language code should follow [ISO 639-1 Code](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes).
|
||
|
|
|
||
|
|
```
|
||
|
|
\frontend
|
||
|
|
|--\assets
|
||
|
|
|--\--\translations
|
||
|
|
|--\--\--\languages.json
|
||
|
|
|--\--\--\en.json
|
||
|
|
```
|
||
|
|
|
||
|
|
<div style={{textAlign: 'center'}}>
|
||
|
|
|
||
|
|
<img className="screenshot-full" src="/img/l10n/files.png" alt="files" />
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
- Let's localize ToolJet in the **French** language. Create a new json file inside the translations directory and name it **fr.json**. `fr` is the language code for French.
|
||
|
|
|
||
|
|
- After creating the new file, open the **en.json** file and copy all the contents of the file to the newly created **fr.json**.
|
||
|
|
|
||
|
|
<div style={{textAlign: 'center'}}>
|
||
|
|
|
||
|
|
<img className="screenshot-full" src="/img/l10n/en.png" alt="files" />
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
- Once copied, you can now start adding the translations for the keywords in the french language.
|
||
|
|
|
||
|
|
- After completing the translation, all you need to do is list the language in **languages.json** file. You'll need to add an object with three key-value pairs. **lang** - the name of the language that you added, **code** - the language code, and the **nativeLang** - name of language in the native.
|
||
|
|
|
||
|
|
```js
|
||
|
|
{
|
||
|
|
"languageList":
|
||
|
|
[
|
||
|
|
{ "lang": "English", "code": "en", "nativeLang": "English" },
|
||
|
|
{ "lang": "French", "code": "fr", "nativeLang": "Français" }
|
||
|
|
]
|
||
|
|
}
|
||
|
|
```
|
||
|
|
|
||
|
|
<!--
|
||
|
|
- Once you list the language in the `language.json` file, you'll be able to see it in the **dashboard**.
|
||
|
|
|
||
|
|
<div style={{textAlign: 'center'}}>
|
||
|
|
|
||
|
|
<img className="screenshot-full" src="/img/l10n/list.png" alt="files" />
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
:::info
|
||
|
|
ToolJet will automatically detect your browser's default language and will switch to it. If your browser's default language translation is not available in ToolJet then it will set English as the default language.
|
||
|
|
:::
|
||
|
|
|
||
|
|
-->
|
||
|
|
|
||
|
|
:::note
|
||
|
|
Feel free to reach us on [Slack](https://tooljet.com/slack) for any help related to Localization.
|
||
|
|
:::
|