Setting Up Translations for CommCare Mobile App

Setting Up Translations for CommCare Mobile App

What Should I Translate?

In CommCare, you can translate all user-facing elements, including menus, buttons, error messages, instructions, and form content. This feature allows users to navigate and comprehend the app in their preferred language, significantly improving usability and effectiveness in multilingual environments.

Some key things to translate for multilingual applications are:

  • Application Translations

  • User Interface Translations

    • Mobile User Interface translations specific to your language. Common phrases (e.g., "back," "form is loading") should be updated accordingly. For further guidance, refer to CommCare User Interface Translations.

Remember to set the default language of your application before creating your released build. You can either click on “Select as Default“ button or Drag and drop the languages and put the default language at the top (as show in the video below).  

20250723-1157-51.9910833.mp4
GIF - How to Set the Default Language of Your Application

Steps to Set Up Mobile Application Translations

The translation process involves a few distinct steps, which can be completed manually or in bulk, depending on your needs.

Step

Description

Link

Step

Description

Link

  1. Configure Languages on App Builder

Add one or more languages to your app and define a default

Setting Up Translations for CommCare Mobile App | Configure Languages on App Builder

  1. Translate App Content

Translate form questions, menus, case lists, multimedia, etc.

Bulk Application Translations

  1. Translate UI Elements

Translate the core CommCare mobile interface (login, errors, etc.)

CommCare User Interface Translations

  1. Allow Language Switching

Let users change the language on their phones or Web App

Setting Up Translations for CommCare Mobile App | Switching Languages in the App

Configure Languages on App Builder

  1. Navigate to the Applications tab. 

  2. Select your application, then click on Languages under Settings in the list on the left panel.

  3. Under Language List add your language code. (i.e. hin for Hindi, en for English, etc.). The field will auto-populate. If your language does not exist, you can Google the language name, and typically the first result on Wikipedia is the right language and has the 3-letter code you need to add. If your language still does not show up, create a new code and add it. Note: This is not recommended, but is OK if the language comes up as "unrecognized." Don't do this if the language comes up as "invalid." 

  4. Click Save.

20250723-1201-06.1219872.mp4
GIF - How to Add a New Language to Your App Builder

Edit Translations Individually (For Smaller Apps or Quick Updates)

Once you have configured the languages in your app builder, your forms and modules will display additional fields for entering translations in each configured language. If your app has only a few forms or you need to make small changes, you can edit translations directly within the form, you can enter them directly in the form builder. However, for larger apps or multilingual projects, it's recommended to use the Bulk Application Translations

20250723-1206-22.6092828.mp4
GIF - How Translation Fields Appear in Questions

 

Now all the module and form names will need to be updated in both languages. A dropdown menu will appear next to the "Languages" menu item so that you can switch between multiple languages.

Multimedia file in multiple languages

  1. If you have already created your app in one language, create a new language for your application (see above for instructions). 

  2. Go into your first form, and click "Edit" on the form questionnaire. 

  3. Just as you would add audio files to an English app, the app should now feature two separate languages. Notice that the names of the two language files are the same.

  4. If you want to upload audio recordings in another language, you will need to change the file names of the new language. Do this and click save.

  5. When you go to multimedia reference, you will now notice that there are new audio files for you to upload. Upload your new audio files here. 

This change will only apply to this particular form. 

Setting Default to a Specific Language

Follow these steps to set your app to a specific language if it supports multiple languages:

  1. Navigate again to the "Languages" part of the Application settings.

  2. Click on Languages again. Here, you will see the different languages associated with your application.

  3. If you see multiple languages and want to change the default, you can click on “Set as default” button or drag the language preferred to the top. The box around the language indicates the default language. 

  4. Save changes.

  5. Go to the Release Manager and make a new build. The forms and modules in the application will default to the language that is listed at the top in the 'Supported Languages' box.

  6. You can also choose to not deploy a language (for example, if you're using English for development and testing, but not in the field), by un-checking the 'Deploy' checkbox.  This will save space on the phone. 

If CommCare HQ already has a list of UI strings translated for your language, all the menus will be displayed in the preferred language. If not, you may contribute translations for UI strings in CommCare; instructions can be found here

To have the new default language show up in your mobile application, you will need to install the mobile application for the first time with the default language. Therefore if you're changing default languages, you will need to uninstall your app and then reinstall the application with the new default language to have the application reference the new default in HQ.

For projects spanning multiple languages(more than 2 to be precise), app building might be inefficient at times with long forms displaying translations for all languages.

You can change the setting "Smart language display in forms" under the languages list on the app settings page. 

Once enabled:

  1. When the selected/current language is the same as the default language, the default language is shown along with other languages.

  2. When the selected/current language is different from the default language, both the default language and the selected language are shown.

20250723-1237-11.2554419.mp4
GIF - How Smart Language Display Works in Forms

Switching Languages in the App

On Android

Follow the below steps to change the default language of the application for the mobile worker:

  1. Login as any user

  2. Click on the three-dot button displayed at the top right corner of the phone (as shown in the image of 'Step 1' attached below).

  3. Choose "Change Language" from the menu that pops up (as shown in the image of 'Step 2' attached below).

  4. Select the desired language (as shown in the image of 'Step 3' attached below).

steps.png
(Steps to select ‘language’ from the application's settings on the phone)

This should automatically switch the forms to the selected language, provided there are translations.

Steps to change the language of the question within an open form:

  1. Open a form

  2. Press the phone's "Settings Button"

  3. Choose "Change Language"

  4. Select the desired language


On Web Apps

Once multiple languages have been added as described earlier in this document, users can switch between them inside forms within a web app. This functionality is primarily designed to be used by multilingual users, who can adjust the language of the form based on who they are contacting and may do so multiple times throughout the day or the form.

To change form language in a Web Apps form:

  • Click the Menu on the top right of the form entry UI. 

  • Under the ‘Languages’ section within the menu, a list of available languages are shown.

Note: Only the language of the form content is switched, the rest of the web app UI remains in the language configured in user settings.

20250723-1232-58.1731160.mp4
Gif - How to Switch Languages in Web Apps

CommCare supports many languages and some require Unicode fonts to display. You may enable native language support in your application so users can enter text in the local language. This only works if your phone model supports the language preferred by your users. 

For the application to recognize the local language and display it correctly, the text needs to be Unicode-enabled/friendly. This is largely an issue for special scripts. See the information below on software you can use to ensure your text is recognized in CommCare and displays correctly on the phone. 

Word processing programs like Word often allow people to install fonts that look like another language but they only work in that application (and often only if you have the font installed). If you want to use special characters in CommCare you have to use the Unicode (text standard) equivalent of the characters.

Unicode Friendly

Non-Unicode Friendly

Unicode Friendly

Non-Unicode Friendly

  • Displays like on any computer regardless of whether the font is installed or not.

  • It is better for sharing content.

  • Readable on mobile phone.

  • Displays like this if the font is not installed on the local computer.

  • Even if the font is installed on the computer, it will display like this on the mobile phone, because you cannot install the same font on the phone.

Unicode Friendly Software

Go to Google Input Tools and choose "Hindi" on the right panel before downloading- free download. This works very similar to Hindi Indic Input or Google Transliterate, in that you type phonetically, but it has a built-in dictionary. It guesses/suggests the word that you are typing and provides alternatives, similar to Google Translate.  It works offline and also supports a bunch of other Indian languages (Bengali, Kannada, Tamil, Telugu, Urdu, etc.)

Now that you've configured your app to support multiple languages, proceed to the following guides for step-by-step instructions: