Summary: Use the language menu to add multiple languages to the same course. You have to create the course in English first, download it as a JSON, translate it, and re-upload it.
Multi-language adds a language selection screen at the start of a course. The same course in multiple languages can all be stored in the same zip.
Note: If you’re using your course in the LXP, the language will automatically be picked to match the language that the user is using the LXP in.
Adding a new language
To create a multi-language version of a course, you must first create it in the default language –English. Before you create your new language, you must ensure that you are happy with the theme customisation and the extensions that have been enabled on the course.
Alert: You will not be able to add/remove extensions after creating a multi-language version without causing significant problems with the course.
1. Click on Language.
2. Click Add new language.
3. Click Yes, I’m sure.
|
4. Select a language from the drop down. 5. You’re essentially duplicating the course, so you must choose which version of the course we would like to clone using the Clone from dropdown option. 6. Click Save. |
|
7. Click Download next to your newly created language. The downloaded file can then be given to a translation company or translator, who can update all the language strings on the course to the new language. 8. Once your language strings have been updated, you can click Upload to upload the translated version. |
9. Click Validate. This will run series of checks to ensure that the structure of the translated file matches the version you are uploading it to.
|
10. This screen will list every language string on the course with a tick or a warning box next to it. You can click Show issues only to see only the areas that have an issue. 11. You can click Show issues to see what’s wrong. 12. Once you’re happy with the changes you’ve made, click Apply translation. |
Editing the JSON
Here’s an example of a JSON file that’s been downloaded for translation. As you can see, the
program we’re using to view the JSON has highlighted the text in orange. A lot of programs will do this so that it’s super-easy to identify the sections that you can edit. We’re using Brackets, an open source text editor available online here.
Switching language in the builder
You can switch between the different languages in the builder and make changes to each separate version of the course. You do this by clicking on the dropdown menu that has appeared in the course. You can’t update the theme or add / remove extensions when you’re editing a language other than the default one.
Whilst the course structure can be modified slightly by doing this, we recommend keeping these changes as minimal as possible.
Configuring and theming the language selection screen
The language selection screen is configured in the language picker extension which is found in Configuration. The language picker extension is added automatically when you add a new language to the course.
Scroll down to Extensions and click on Language Picker to open it.
- Is enabled: This is a true/false dropdown and must be set to true to allow users to select their language.
- Browser Window Title: This is a text entry box and will be the name of the window. Suggested text: "Language Selection".
- Language Picker Title: This is a text entry box and will be the header text on the page. Suggested text: "Language Selection".
- Language Picker Body text: This is a text entry box and will be the body text presented to the user on the page. Suggested text: "Please select the language you would like to view this course in."
- Show on course load: This is a true/false dropdown and must be set to true to allow users to select their language when they first enter the course.
- Class to customise Language Picker icon in the navbar: This is a text box that allows you to enter a class to determine which icon is used on your course to allow users to switch languages mid-course.
-
Classes: The classes field works on the Salsa theme and behaves just like the classes field throughout Authoring - Library Content, allowing you to add any of the following classes to the language picker screen:
- background-colour1: adding this class will pull in the background colour as defined in Theme Customisation. This can be any one of the background colours from 1-12.
- background-image1: adding this class will pull in the background image as defined in Theme Customisation. This can be any one of the background images from 1-36.
- transparent: This will remove the background colour on the Language Picker Title and Language Picker Body text, leaving the text sitting directly on top of the image.
- semi-transparent: This will create a semi-transparent background colour on the Language Picker Title and Language Picker Body text.
If you opt not to use the classes field to style the language picker screen, then the colour scheme on this window will be set by the following fields in theme customisation:
- Primary Colour: this will control the colour of the buttons on the screen
- Background Colour: this will control the colour of the background
Here's an example of a language selection page with no classes applied to it:
With background-image1 applied:
The main background will be replaced with an image but the buttons and text boxes will still take their colour from the primary colour and background colour.
With background-image1 and background-colour1 applied:
When the two background classes are added together the main background will be replaced with an image and the buttons and text boxes will still take a slightly darker tone based on the colour as defined in theme customisation.
Background-image1, backgroundcolour1 and transparent applied:
When these three classes are added together the main background will be replaced with an image and the buttons will take a slightly darker tone based on the colour as defined in theme customisation. However, the text boxes will be completely transparent. This will work best with an image that contains dark colours or the text may be difficult to read.
Background-image1, backgroundcolour1 and semi-transparent applied:
When these three classes are added together the main background will be replaced with an image and the buttons will take a slightly darker tone based on the colour as defined in theme customisation. The text boxes also take a slightly darker tone based on the colour as defined in theme customisation, however, they will also be semi-transparent allowing the image to be seen underneath.
Setting up the switch languages screen
To configure the Switch languages screen, you need to edit each individual language. You can do this by clicking on the language and then editing the following fields:
- Language Code: This should not be edited, it’s added automatically when a language is added
- Text direction: A dropdown option that allows you to select ltr or rtl depending on the language you are using, this will also be updated by default.
- Language Name: Our suggestion would be to use the name of the language, in the language e.g. English, Francais, Deutsch.
- Confirm Title: A title which will appear in the header when a user is switching languages mid-course.
- Confirm Message: Enter the text which will appear to the user when switching languages mid-course, we suggest informing the user that all progress will be lost if they switch languages
- Confirm: Enter the text that will appear on the confirm button when switching language.
- Cancel: This is a text entry box that allows you to enter the text that will appear on the cancel button when switching language.
Note: If a user chooses to change language after the initial language selection, any current progress will be lost.