One of the more challenging aspects of developing a site on a global scale is enabling it to manage multiple languages. For sites based on Open edX , integrating multilingual features is certainly no easy task. To make things easier however, we’ve provided a clear step by step solution to this.
First off, there are two possible services available that can help make an Open edX site multilingual:
Transifex:
Officially supported by Open edX to localize edX site,s Transifex is where all translation of the Open edX framework is currently hosted. Here’s a link to their site: www.transifex.com
Here’s how you can integrate this in your code:
Section 1: Developer Stack Configurations
Step 1: Switch to edXapp environment:
Step 3: Make sure all languages you wish to download are present and uncommented in
Step 5: Configure EDXAPP_LANGUAGE_CODE in your configuration files. Here’s an example: Step 6: Execute the following command in your edx-platform directory with your edx-platform virtualenv:
Section 2: MultiLingual edX site
Setting the LANGUAGE_CODE enables one language as your installation's default language. You’re probably asking: “What if you want to support more than one language? To "release" a second (or third, or hundredth) language here is a list of instructions to do so:
Step 1: First, you have to configure the languages in the admin panel.
Step 2: While the LANGUAGE_CODE variable is used to determine your server's default language, in order to "release" additional languages, you have to turn them on in the dark lang config in the admin panel. Here’s an example link of where the dark lang config is located in the admin panel:
YourAwesomeDomain.com/admin/dark_lang/darklangconfig/
Step 3: After this, add the language codes for all additional languages you wish to “release” in a comma separated list. For example, to release French and Chinese (China), you'd add fr, zh-cn to the dark lang config list.
Note: You don't need to add the language code for your server's default language, but it's certainly not a problem if you do.
Note: Remember that language codes with underscores and capital letters need to be converted to using dashes and lower case letters on the edX platform. For example the language code of Chinese (Taiwan) is "zh_TW" on Transifex, but "zh-tw" on the edX system.
Confusing? I know. However, the benefits definitely outweigh the initial confusion. Benefits include that you can preview languages before you release them by adding: ?lang-code=xx to the end of any url, and ?clear-lang to undo this. Here’s an example:
Section 3: Full stack Configurations
For a Local Full stack installation, follow Step One and Two from the Devstack deployment section and then follow these steps:
Option 1: If you only need to pull translations of one language, simply execute the following command in your edx-platform directory with your edx-platform virtualenv:
Option 2: If you already have your own changes of edX-platform's source code in your local installation or the source files on Transifex is not up-to-date, you may need to extract strings manually. The following steps below will show you how:
Step 1: Execute the following command in your edx-platform directory with your edx-platform virtualenv:
Step 3: Edit the .po file and then recompile them using: $ paver i18n_fastgenerate
Note: If you want to change the default language code of a Full Stack, you can modify the value of LANGUAGE_CODE inside lms.env.json and/or the cms.env.json located in /edx/app/edxapp before restarting your Full Stack.
Result: After completing these steps, you should see updated translations. If for some reason they don’t show up, try to restart the nginx server and/or clear your browser's cache.
Localizejs:
Localize is a promising and insanely easy-to-use service that runs on your website by executing from a one-line JavaScript snippet. This one line of code will load Localize on your site and automatically change the language based on the language preference of visitors.
How it works:
By loading Localize code onto your website, it can:
Integrating localizejs is a very straightforward process:
Step 1: Create a project account on localizejs.com. As a result, a localized code snippet with project id is generated.
Step 2: Add this code snippet to the header file of the website.
for eg: 1) main.html
2) django_main.html
Results: After reloading the page, a toggle menu bar will appear on the page with languages ts hat you selected in your localizejs account. This enables users to select a language of his/her choice. And as soon as they do this, bingo, the language on all pages that have the snippet is changed based on the user’s choice.
Afterthoughts:
Following the successful installation of either of the two services, the sheer number of languages provided makes the whole process worth it. From Arabic to Swahili, both of these solutions provide an astounding 93 languages in total. When you’re trying to attract customers from around the world, comprehensibility plays a critical role in this. By integrating multiple languages on an edX site, not only is it a huge step towards fixing localization issues, but you’re developing a higher standard of consideration towards your visitors.
Reference: https://github.com/edx/edx-platform/wiki/Internationalization-and-localization
First off, there are two possible services available that can help make an Open edX site multilingual:
- Transifex
- Localizejs
Transifex:
Officially supported by Open edX to localize edX site,s Transifex is where all translation of the Open edX framework is currently hosted. Here’s a link to their site: www.transifex.com
Here’s how you can integrate this in your code:
Section 1: Developer Stack Configurations
Step 1: Switch to edXapp environment:
- sudo -H -u edxapp bash
- source /edx/app/edxapp/edxapp_env
- cd /edx/app/edxapp/edx-platform
- [https://www.transifex.com]
hostname = https://www.transifex.com
username = user
password = pass
token = - *Make sure the token is left blank*
Step 3: Make sure all languages you wish to download are present and uncommented in
- conf/locale/config.yaml.
- locales:
- ar # Arabic
- zh_CN # Chinese (China)
- from .dev import *
USE_I18N = True
LANGUAGES = ( ('es-419', 'Spanish'), )
TIME_ZONE = 'America/Guayaquil'
LANGUAGE_CODE = 'es-419'
Step 5: Configure EDXAPP_LANGUAGE_CODE in your configuration files. Here’s an example: Step 6: Execute the following command in your edx-platform directory with your edx-platform virtualenv:
- $ paver i18n_robot_pull
- This command will pull reviewed translations for all languages that are listed in conf/locale/config.yaml.
- To only pull down some languages, edit conf/locale/config.yaml appropriately.
- To pull unreviewed translations along with reviewed translations, edit edx/app/edxapp/venvs/edxapp/src/i18n-tools/i18n/transifex.py
- $ paver lms -s dev_es -p 8000
- Be sure your browser is set to prefer the language set in LANGUAGE_CODE.
- In common/djangoapps/student/views.py the user's language code is trying to be obtained from a saved preferences file. Therefore, if you’re having issues seeing your language served up, it may be because your User object has a different language saved as a preference. Try creating a new user in your environment, this should clear up the issue.
Section 2: MultiLingual edX site
Setting the LANGUAGE_CODE enables one language as your installation's default language. You’re probably asking: “What if you want to support more than one language? To "release" a second (or third, or hundredth) language here is a list of instructions to do so:
Step 1: First, you have to configure the languages in the admin panel.
Step 2: While the LANGUAGE_CODE variable is used to determine your server's default language, in order to "release" additional languages, you have to turn them on in the dark lang config in the admin panel. Here’s an example link of where the dark lang config is located in the admin panel:
YourAwesomeDomain.com/admin/dark_lang/darklangconfig/
Step 3: After this, add the language codes for all additional languages you wish to “release” in a comma separated list. For example, to release French and Chinese (China), you'd add fr, zh-cn to the dark lang config list.
Note: You don't need to add the language code for your server's default language, but it's certainly not a problem if you do.
Note: Remember that language codes with underscores and capital letters need to be converted to using dashes and lower case letters on the edX platform. For example the language code of Chinese (Taiwan) is "zh_TW" on Transifex, but "zh-tw" on the edX system.
Confusing? I know. However, the benefits definitely outweigh the initial confusion. Benefits include that you can preview languages before you release them by adding: ?lang-code=xx to the end of any url, and ?clear-lang to undo this. Here’s an example:
- 127.0.0.1:8000/dashboard?preview-lang=fr #French
- 127.0.0.1:8000/dashboard?clear-lang #Sets the site back to default language
Section 3: Full stack Configurations
For a Local Full stack installation, follow Step One and Two from the Devstack deployment section and then follow these steps:
Option 1: If you only need to pull translations of one language, simply execute the following command in your edx-platform directory with your edx-platform virtualenv:
- $ tx pull -l <lang_code>
- *The <lang_code> here should be replaced by the language code on Transifex of the language you want to pull (for example, zh_CN for Chinese (China)).
Option 2: If you already have your own changes of edX-platform's source code in your local installation or the source files on Transifex is not up-to-date, you may need to extract strings manually. The following steps below will show you how:
Step 1: Execute the following command in your edx-platform directory with your edx-platform virtualenv:
- $ paver i18n_extract
- This command will extract translatable strings into several .po files located in the conf/locale/en/LC_MESSAGES.
Step 3: Edit the .po file and then recompile them using: $ paver i18n_fastgenerate
Note: If you want to change the default language code of a Full Stack, you can modify the value of LANGUAGE_CODE inside lms.env.json and/or the cms.env.json located in /edx/app/edxapp before restarting your Full Stack.
Result: After completing these steps, you should see updated translations. If for some reason they don’t show up, try to restart the nginx server and/or clear your browser's cache.
Localizejs:
Localize is a promising and insanely easy-to-use service that runs on your website by executing from a one-line JavaScript snippet. This one line of code will load Localize on your site and automatically change the language based on the language preference of visitors.
How it works:
By loading Localize code onto your website, it can:
- Identify text on your website,
- Replace text with translations, when available,
- Adapt the text for pluralization and variables,
- Order translations for unrecognized content,
- Help you go global!
- View content and translations
- Add or remove languages
- Translate content
- Order translations (machine or human)
Integrating localizejs is a very straightforward process:
Step 1: Create a project account on localizejs.com. As a result, a localized code snippet with project id is generated.
Step 2: Add this code snippet to the header file of the website.
for eg: 1) main.html
2) django_main.html
Results: After reloading the page, a toggle menu bar will appear on the page with languages ts hat you selected in your localizejs account. This enables users to select a language of his/her choice. And as soon as they do this, bingo, the language on all pages that have the snippet is changed based on the user’s choice.
Afterthoughts:
Following the successful installation of either of the two services, the sheer number of languages provided makes the whole process worth it. From Arabic to Swahili, both of these solutions provide an astounding 93 languages in total. When you’re trying to attract customers from around the world, comprehensibility plays a critical role in this. By integrating multiple languages on an edX site, not only is it a huge step towards fixing localization issues, but you’re developing a higher standard of consideration towards your visitors.
Reference: https://github.com/edx/edx-platform/wiki/Internationalization-and-localization