# Portal Translations

{% hint style="info" %}
Translation and Localization of the Developer Portal Application is available with the [**Security & Compliance**](https://help.form.io/developer-tool-ecosystem/the-security-module) module. Please contact <sales@form.io> for more information.&#x20;
{% endhint %}

### Creating translations

In order to provide translations to the Portal application, you can add the translations using the **Language Resource** in the **Form.io Portal Base Project**. This resource has the following structure:

![](https://3305536326-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MPHoF2HwOA0s5HV_AIB%2Fuploads%2FxZJwm54GUzgr5kJjruxd%2Ftranslate1.png?alt=media\&token=1315219b-45b3-4215-b76d-c28cc415747c)

Within this resource, we have the following fields:

* A Text Field called **Language**, which represents the language name.
* A Text Field called **Language code**, which is a shorthand alias for the language.
* A Data Map component called **Translations**, that has 2 fields: Text field for keys and one for translations.

A list of the keys can be found in the Translations JSON file, which is provided separately, where every chunk of text in the Portal Application is matched by a key with a meaningful name. By default, every key represents an English translation.

{% hint style="info" %}
Portal Translations are part of the Security Module. Please contact <sales@form.io> for more information to add this Module to your subscription and obtain the JSON file needed for Portal Translations.
{% endhint %}

You can create a new submission for each translation like the following screenshot, which illustrates a submission for Spanish language:

![](https://3305536326-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MPHoF2HwOA0s5HV_AIB%2Fuploads%2Fe3sGPDNhHHl8iJZgFGqe%2Ftranslate2.png?alt=media\&token=99062a3f-28fb-420f-a40d-6e202848a159)

Once you've created a submission in the Language resource, a new "language" is created. This is what will be used to manage all of the translations so you can now input the rest of your language translations the same way until you have multiple to chose from.

### Dynamic language switch

When you have multiple languages created, the **Language** switch dropdown appears in the navigation bar.

Here you can select any language from the list of languages you have configured. The currently selected language is highlighted as shown below.

![](https://3305536326-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MPHoF2HwOA0s5HV_AIB%2Fuploads%2FVfmAupTG1EcdkGXHOOyH%2Ftranslate3.png?alt=media\&token=a8aaa037-769f-42a5-a117-9cd381cfdc9e)

Selecting a new language will trigger a language change for all of the keys that were provided with translation in the submission for that particular language.
