Languages & Localization

Discover how to add multiple languages to your project.

PandaSuite does not automatically translate your content, but the tool greatly facilitates the integration of your content in multiple languages.

Add a language

By default, your project is built in a single language.

Before editing content in another language, it is necessary to add this language to your project to facilitate your configuration and have the ability to switch from one to another.

Here are the steps to add the new language:

1. Go to the Project properties.
2. In the Languages section, click on + Add.
3. Declare the initial language of the project, the one in which you have worked until now.

4. Add one or more other languages. You can add as many languages as necessary.
5. Use the pin icon to set the default language, which will automatically apply when the project is opened.

Edit a language

When you want to edit a specific language:

1. Click on the flag located at the bottom right of your workspace.
2. Select the flag corresponding to the desired language.

You can modify:

• Texts, images, audio/video content (Video Player and Fullscreen Video). Ensure that images maintain the same ratio to avoid distortion.
• Specific properties of certain components, such as the URL Media Player or the Web component (e.g., modify a URL per language). It is not yet possible to change actions (e.g., Open an external URL) by language, but you can add a data binding on this URL to a variable per language.
• Dynamic display using the Flexbox component, which adjusts the size of a block according to the language.

Create a language switch menu

You can customize the language switch menu:

• Select the trigger element (flags, FR/EN, etc.).
• Add a new action.
• Select the action Change language and define the desired language.

Your application will automatically adapt.

Automatic localization based on device language

You can synchronize your application with the user's device language.

1. Add a Condition component and create a condition per language.
2. Activate the Automatic evaluation option so that the condition is automatically evaluated.

3. In the If field, choose the data Project > Context > locale, then use the Starts with function.

   Define the desired language value (e.g., “fr” for French, “en” for English, etc.). To find the corresponding language code, refer to: Language designators with region.

4. Define an action: if the condition is met (i.e., if the device language matches the defined value), use the Change language action and select the appropriate language.
5. Repeat these steps for each integrated language.

Automatic localization based on a URL parameter

It is possible to define the application language via a URL parameter.

Add a parameter for the language in the project properties

1. Go to your Project properties and add a custom parameter named lang .
2. Set a default value (e.g., fr for French).

Create a condition to evaluate the lang parameter

1. Add a Condition component at the project level.
2. Configure a condition to check the value of the lang parameter.

Configure the language change action

1. In the If field, select the data Project > Context > Launch > Parameter(s) > lang.
2. Add a rule to evaluate the parameter value (e.g., lang = en for English).
3. Define the Change language action.

Repeat for each supported language

Repeat the previous steps for each language in your project by adding a specific condition for each.

Languages and dynamic content

It is also possible to add languages in the PandaSuite database.

First, make sure that the desired languages are properly added to your project.

Once done, you can enrich your PandaSuite database with additional translations for each key. Each dynamic content element can have versions in all the languages you have defined.