Builder and Extensions Localization

Shoutem builder and its extensions are in English language, you translated your apps but would also like to have builder in different language? You are on the right track.

One of the premium features you have access to while being a Shoutem Reseller client is the ability to translate the whole builder interface and all features – extensions, to your respective language. Having a branded White-label dashboard and the translated builder will accommodate easy app management not only to you but to your clients, app Moderators.

Translation process

The process and its rules are similar to the rules from our Localization tutorial, however in this case, you will translate strings that are showing in the builder.

Translation is completed in three parts individually:

The first two settings are being modified in the builder area under your Agency Account settings, and therefore are available only to you as an Agency owner. Once you are logged in, click on the caret icon next to your email address in the upper right corner and choose My Account → Agency.

app localization

1. Builder localization settings Basically, everything you see in the Builder via Internet browser on your computer.

HOW to

To use your Builder translation, you will need to download the source language file available in that section and replace all the English strings with either different language or alternative English strings.

Source language file would be downloaded as builder-translation.json, for editing, please use any program for text editing but make sure that after saving the translation, program formatting is not applied or the builder localization will not work properly.

After you are done translating the file, save it and rename it to the language you want to translate your app to, e.g de.json for German.

In the Builder localization settings, click on Add translation option and add your just translated file.

builder localization settings

2. Extensions localization settings – File containing extension names & descriptions. Stuff that s displayed in the Builder, but refers to extensions.

how to

The process is the same as for the Builder localization, however, here you will translate strings from features available in the builder. For example, when you select the Places screen, while adding the content, the name of the offered fields will not be in English but in your selected language.

In this JSON file, you will see some kind of sections which will guide you and help you understand which feature is in question.

3. Extensions translation

Every extension is a separate Shoutem plugin, treated as its own entity. That is why every extension has its own translation file. Extension pages are hosted in the Builder but still belong to extensions.

how to

You can find all Shoutem extensions listed in the Extensions tab for each app, then each Extensions has its own localization settings as displayed on the following image.

radio app localize

Creating your JSON file with your language is processed the same.

Some extensions are dependant on each other. 
For instance, there is a “parent” RSS extension that has “child” extensions (News RSS, Videos RSS, Photos RSS, Podcasts). Child extensions are displaying content that is defined in the parent extensions. That is why to translate the News RSS screen, you need to create translations for the RSS extension.

How to properly translate JSON file strings?

Left side of the JSON file will remain in English language because that strings builder and extensions will use to read your translation. For example:

translate JSON file
English string from original file
trnaslated JSON file
Translated English string to German

We have short examples of how to translate more complex strings with pluralization and variables. After translating the strings to your chosen language, you can validate the JSON for any syntax errors using a free and easy to use a tool like JSONLint.

Will I need to repeat this process again in the future?

Not entirely. Steps 1 & 2 from the process are completed only once because those are a global translation of the builder under your Agency account. There are possibilities small modifications will be required in existing translated files only when we add a new feature in the builder, or for some reason make certain adjustments in the builder. Since your translated JSON file will not be automatically updated, you will be required to maintain it.

For the same reason, we added three additional options for uploaded files, one of them is Download option which will make the maintenance process a lot easier and save time.

app localization

Regarding the Step 3 from the process, each app has its own set of Extensions, so you will need to keep uploading already translated files if it is being required in newly created apps.

Do I need to upload my Extension translation files in each created app?

Yes, but this applies only to Extensions translation (Step 3.). We advise you to store your translated JSON files safely on your computer or Drive because you will use them often. It all depends on how many apps you have on your Agency account.