CommCare User Interface Translations

Even if your forms are built in a language other than English, you may still see certain parts of your application; such as error messages, log-in screens, and menu options are displayed in English. These are called user interface strings.

This guide walks you through the process of updating user interface translations in your application to ensure a fully localized experience.

Steps for Adding or Editing UI Translations

1. The first step is to make sure you are viewing the application in the correct language, e.g. if you created an application in English and French and now want to update the User Interface in French, then you would first need to change the language setting from English to French, like shown here in the image and GIF below.

   Open

   

   Image- Changing language from English to French

Open

GIF - Changing language from English to Hindi

2. On the Languages page, select CommCare Translations. This action will open options to automatically fill in translations for existing keys. Before you begin, ensure that someone else hasn’t already completed the work for you!
   
   

   Open

   

    

3. Click on "auto fill translations" button and CommCare will provide its best educated guess for the appropriate translation. For instance, if another organization has developed an application in Thai, CommCare will automatically populate the translations with any user interface translations they have employed. You have the option to adopt these suggestions or modify them as you see fit. If multiple organizations have created applications in Thai, CommCare will identify the most frequently used translations for each text string and recommend those. You can find the auto fill translations button located at the bottom of the phrase list within the CommCare Translations section.

Open

GIF - How to run CommCare Translations

If no translations exist for your selected language, the fields will remain blank.

4. Now, next step is to review and edit the translations. Each generated row has a key (e.g., restore.message.connection.failed) and a translation.

   You can:

   1. Accept suggested translations and click Save.

   2. Edit any field manually.

   3. Add new translations by typing the key and the desired text, then clicking the + icon.

   4. Remove translations by clicking the x icon.

   Open

   

    

Adding New Translations Manually

To add a translation not already listed:

1. Visit the CommCare UI Translation Library on GitHub.
   
   

   Open

   

2. Search for the English phrase (e.g., “Required question. Please answer it to continue.”).

3. Copy the key (left of the = sign, e.g., required.question).

4. Paste it into the left box in CommCare, and add your translation on the right.

5. Click + to add it to the list.

6. Click Save to store your changes.

Bulk Editing Translations

To manage user interface translations at scale:

1. Go to App Settings > Languages.

2. Click Bulk CommCare Translations to download your translations as an Excel file.

3. Update the relevant columns (e.g., hin,fr) with your desired translations.

4. Save the file and upload it back into CommCare.

Android-Specific UI Translations

Some Android-specific interface strings (e.g., error messages or toast notifications) are also available on GitHub. You can translate these using the same process described above.

Customizing Buttons and End-of-Form Messages

You can customize system button text like “Submit,” “Continue,” or success messages that appear at the end of a form:

1. Download the Bulk Application Translations. CommCare User Interface Translations | Bulk Editing Translations

2. Navigate to the relevant menus_and_forms sheet.

3. Find the text you want to change and update the default_en column (or your target language column).

4. Save and re-upload the spreadsheet to CommCare.