# Adding New Language

In order to add a new language in the template, you need to follow below steps.

We are taking the Russian language as an example. So, here are the steps:

1. **Create a Locale**

   This step can be completed by following below instructions:

   * **Create a Local JSON File**

     We need a locale data json file where we can keep all our labels, messages etc. language variables to set their translations for the specific language.

     For this, create a file “ru\_RU.json” under the folder `src/lngProvider/locales/`

     Now, you can copy the whole content of file `src/lngProvider/locales/en_US.json` (this contains all translation variables with value of English language strings) and paste that into our newly created ru\_RU.json file.

     The above step will give us all the labels, messages etc variables and we can replace their values with the Russian translation.

     For example, let’s change value of “pages.samplePage” : “Sample Page” to “pages.samplePage”: “Пример страницы”.

   * **Create i18 Context**

     Now, in this step, we are going to create an entry file `src/lngProvider/entry/` folder with the name “ru\_RU.js”.

     This file is needed to import both the react-intl’s local data and our locale data json file and setup the i18 context.

2. **Add Locale to appLocales**<br>

   In this step, we will add our newly created i18 context in above step to the react-intl’s appLocales. This will be done in two further steps:

   1. Open the file src/lngProvider/index.js and Import i18 context locale entry file into this.
   2. Add imported i18 context variable to the appLocale Object. Check following source code for reference:<br>

3. **Add an Option to Language Switcher**<br>

   For this, we need to access the data.js file which can be found under src/componenets/LanguageSwitcher/ folder.

   Here in this file, we need to add following language object to the languageData array:

   ```
   			
   {
   	languageId: 'russian', // Unique ID for language
   	locale : 'ru',         // locale name to link with the previously named locale
   	name : 'Russian',      // Display name of the language
   	Icon : 'ru'            // To choose the flag of the country
   }
   ```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs-jumbo-react.g-axon.work/settings/adding-new-language.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.