Localization
Nitro's built-in language support allows blocks and APIs to work in collaboration with user-facing content translations to achieve a fully translated program. Show me a diagram of the localization process
To translate your program, you will need to:
-
Enable localization. Show me supported locales
Argentinian (ar-MEA) |
English - Asia (en-ASIA) |
English - Pan-European (en-PAN-EURO) |
German - Switzerland (de-CH) |
Lithuanian (lt-lt) |
Spanish - Colombia (es-CO) |
Bulgarian (bg-BG) |
English - Australia (en-AU) |
English - United States (en-US) |
Greece (gr-GR) |
Malay (ms-MY) |
Spanish - Latin America (es-LAM) |
Chinese (zh-CN) |
English - Canada (en-CA) |
English ADRIA (en-ADRIA) |
Greek (el-GR) |
Norwegian (nb-NO) |
Spanish - Mexico (es-MX) |
Chinese Traditional (zh-HK) |
English - Finland (en-FI) |
Finish (fi-FI) |
Hebrew (iw-iw) |
Poland (pl-PL) |
Spanish - Spain (es-ES) |
Czech (cz-CZ) |
English - Great Britain (en-GB) |
French (fr-FR) |
Hebrew (he-IL) |
Portugese - Brazil (pt-BR) |
Spanish - United States (es-US) |
Czech (cs-CZ) |
English - Greece (en-GR) |
French - Belgium (fr-BE) |
Hungarian (hu-HU) |
Portugese - Portugal (pt-PT) |
Swedish (sv-SE) |
Danish (da-DK) |
English - India (en-IN) |
French - Canada (fr-CA) |
Indonesian (id-ID) |
Romanian (ro-RO) |
Taiwanese (zh-TW) |
Dutch - Belgium (nl-BE) |
English - Ireland (en-IE) |
French - Morocco (fr-MA) |
Italian (it-IT) |
Russian (ru-RU) |
Thai (th-TH) |
Dutch - Netherlands (nl-NL) |
English - Israel (en-IL) |
French - Switzerland (fr-CH) |
Italian - Switzerland (it-CH) |
Slovak (sk-SK) |
Turkish (tu-TR) |
English - Africa (en-AFRICA) |
English - New Zealand (en-NZ) |
German (de-DE) |
Japanese (ja-JP) |
Spanish (es-LA) |
Turkish (tr-TR) |
English - Arabia (en-ARABIA) |
English - Norway (en-NO) |
German - Austria (de-AT) |
Korean (ko-KR) |
Spanish - Argentina (es-AR) |
Ukranian (ua-UA) |
-
Translate your program content such as missions, levels, and recognitions.
-
Translate your front-end UI. This front-end may be blocks or a custom program created with APIs.
Note: Bunchball Go can be used globally but does not support localization in the front-end UI.
Enable Localization and Translate Program Content
Step 1: Enable localization in Nitro Studio. Show details
- Open Nitro Studio > Configuration > Localization.
- In the Enable Locales list, select the locales your site is using.
Localization must be enabled before it's available in your environment. Contact Bunchball Support for assistance.
Step 2: Translate your mission information, levels, exchanges, and other program content. Show details
An Excel or XML translation file is used to localize program content. Each locale you choose to support has its own translation file which is managed in Nitro Studio. Translation text within the Excel or XML file must be in Ascii format.
-
Open Nitro Studio > Configuration > Localization.
-
Under Translate Content:
-
Select Excel or XML as your file type.
-
In the Download Translation File list, select the language file you want to download.
-
Click Download.
-
When downloading translatable data, you must download from the instance you want to localize. You cannot download a template from your Sandbox instance and try to upload it to Production. Although the content may be the same between instances, the object IDs are different.
-
Update the value field for every value you want to localize and save the file.
-
When you've finished translating your content, open the Localization page and click Upload Translation File.
Note: If you receive an error when uploading a translation file, make sure the file size is less than 1MB. If you have a large number of missions, you may need to split your data into multiple files for upload.
-
Repeat steps 2-4 for each language your program supports.
-
As your program grows, you will need to repeat this process to translate new content.
Note: If you upload a translation file and then download via the same browser, the file may not contain all translations until you refresh the cache.
Translate User Facing Elements
Nitro Impact and Blocks
Complete the following to translate your program. Note: Impact can be used globally but does not support localization of quizzes.
Step 1: Translate blocks. Show details
Each block requires its own translation file which is managed in Nitro Studio. JSON is the only supported file type for blocks.
-
Open Integrate > Blocks > click the block you want to localize.
-
Click the Languages drawer and then click Download.
-
Update the localization file to include all language codes and translations for each language in your program.
-
Upload the updated localization file to the Languages drawer and click Save.
The languages in your file will display in the drawer. Click a language in the list to preview the translations.
-
Add the "language" attribute and the language code to the block embed code in the src URL.
The "language" attribute accepts one or multiple values (e.g. language=es-MX,es-ES). If you have multiple languages, use a token that can be replaced at runtime with the user's language code.
<div style="width: 100dvw; height: 100dvh">
<iframe title="Impact"
allow="clipboard-write"
style="border: none; width: 100%; height: 100%"
src="https://blocks.bunchball.com/embeds/impact/407481ac-4dca-xxxx-651154f697b1?token=d89e8axxxx318fee9d4x87b74e9d29&language=es-MX"></iframe>
</div>
Custom Programs
When translating a custom program created using APIs, you can use Nitro APIs to return the localized data you uploaded to Nitro Studio for mission, levels, etc. Then, UI elements will require additional translation with your custom build.
Step 1: Translate custom elements created using APIs. Show details
-
Use the Localization view in Nitro Studio to find your language code. Use a 2-digit code to translate into the base language and a 4-digit code to translate into the locale.
-
Add the "Accept-Language" header and language code to all your API calls.
The header is required on every API call as each is a single transaction and there is no session data.
Step 2: Translate quizzes. Show details
Quiz content (quiz name, questions, and answers) is translated as flat text.
Translation overrides are EXACT matches on the quiz content including the quiz title and description, question text, and answer text. Matches are case-sensitive.
-
Create a translation schema containing your quizzes, their questions, and their answers (or add quizzes to your existing translation schema). No quiz, question, or answer IDs are needed.
-
If you're translating into multiple languages, add a custom override for each language your program supports.
-
Add the "data-translation-reference" attribute to reference your translation schema.
<script>
window.BunchballTranslations = {
es: {
translation: {
// quiz 1
"Space": "Espacio",
"The space quiz": "la prueba del espacio",
"Is Pluto a planet?": "¿Plutón es un planeta?",
"no": "no",
"yes": "sí",
"Why do the moon and sun look bigger on the horizon?": "¿La atmósfera de la Tierra es una lupa?",
"Earth's atmosphere is a magnifying glass": "La atmósfera de la Tierra es una lupa",
"We have tears in our eyes watching them": "Tenemos lágrimas en los ojos mirándolos",
"Earth's gravity bends light so we 'see' them before seeing them": "La gravedad de la Tierra dobla la luz para que los 'veamos' antes de verlos",
"What is Ceres?": "¿Qué es Ceres?",
"Dwarf planet": "Planeta enano",
"Asteroid": "Asteroide",
"Constellation": "Constelación"
}
}
}
</script>
Translation Keys
A separate translation key exists for each block and includes the strings needed for a full translation of the individual block. This information will change as a block is updated and text is added or changed. Not that tokens like "{{balance}}" should not be translated.
Download the current translation key in the Block Builder for the block you want to translate.
{
"en-US": {
"form-amount-col": "Amount ({{minValue}}-{{maxValue}})",
"form-amount-total": "Total expense: {{totalExpense}}",
"form-balance": "Your new balance: {{balance}}",
"form-balance-low-error": "Balance is too low",
"form-category-select-label": "Category",
"form-confirm-amount-total": "Total expense",
"form-confirm-amounts-label": "Amount",
"form-confirm-balance": "Your new balance",
"form-confirm-category-label": "Category",
"form-confirm-message-label": "Message",
"form-confirm-recips-label": "Recipient",
"form-confirm-title": "Confirmation",
"form-confirm-warn": "Please review before sending! Once sent, it cannot be undone.",
"form-exchange-label": "Program",
"form-exchange-select-label": "Select Program",
"form-invalid-amount-error": "Enter a valid amount",
"form-invalid-comment-error": "Comment is required",
"form-invalid-recipients-error": "Recipients are required",
"form-message-label": "Message",
"form-next-button": "Next",
"form-recips-label": "Recipient",
"form-recips-select-label": "Recipients",
"form-same-amounts-checkbox": "Same amount for recipients",
"form-sent-again-link": "Send another",
"form-sent-button": "Done",
"form-sent-label": "Sent!",
"form-submit-button": "Submit",
"header-send-rec-button": "Send a recognition",
"header-title": "Recognition",
"navigation-previous-page": "Back",
"rcvd-detail-amount": "Amount: ()",
"rcvd-detail-category-label": "Category: ",
"rcvd-detail-date": "Received: {{date}}",
"rcvd-detail-message-label": "Message",
"rcvd-detail-sender-label": "You received from",
"rcvd-tab-blank-msg": "You haven't received a recognition",
"rcvd-tab-label": "Received",
"sent-detail-amount": "Amount: ",
"sent-detail-amounts-label": "Amount",
"sent-detail-category-label": "Category: ",
"sent-detail-date": "Sent: {{date}} ",
"sent-detail-message-label": "Message",
"sent-detail-recips-header": "You sent to",
"sent-detail-recips-label": "Recipient",
"sent-tab-blank-msg": "You haven't given a recognition",
"sent-tab-details-link": "Show details",
"sent-tab-label": "Sent",
"sent-tab-mltpl-recips-link": "more"
}
}
{
"fr-FR": {
"form-amount-col": "Montant ({{minValue}}-{{maxValue}})",
"form-amount-total": "Dépense totale: {{totalExpense}}",
"form-balance": "Votre nouveau solde: {{balance}}",
"form-balance-low-error": "Le solde est trop faible",
"form-category-select-label": "Catégorie",
"form-confirm-amount-total": "Dépense totale",
"form-confirm-amounts-label": "Montant",
"form-confirm-balance": "Votre nouveau solde",
"form-confirm-category-label": "Catégorie",
"form-confirm-message-label": "Message",
"form-confirm-recips-label": "Destinataire",
"form-confirm-title": "Confirmation",
"form-confirm-warn": "Veuillez vérifier avant d'envoyer! Une fois envoyé, il ne peut être annulé.",
"form-exchange-label": "Programme",
"form-exchange-select-label": "Sélectionnez le programme",
"form-invalid-amount-error": "Entrez un montant valide",
"form-invalid-comment-error": "Un commentaire est requis",
"form-invalid-recipients-error": "Les destinataires sont requis",
"form-message-label": "Message",
"form-next-button": "Suivant",
"form-recips-label": "Destinataire",
"form-recips-select-label": "Destinataires",
"form-same-amounts-checkbox": "Même montant pour les bénéficiaires",
"form-sent-again-link": "Envoie un autre",
"form-sent-button": "Fait",
"form-sent-label": "Envoyé!",
"form-submit-button": "Soumettre",
"header-send-rec-button": "Envoyer une reconnaissance",
"header-title": "Reconnaissance",
"navigation-previous-page": "Dos",
"rcvd-detail-amount": "Montant: ()",
"rcvd-detail-category-label": "Catégorie: ",
"rcvd-detail-date": "Reçu: {{date}}",
"rcvd-detail-message-label": "Message",
"rcvd-detail-sender-label": "Vous avez reçu de",
"rcvd-tab-blank-msg": "Vous n'avez pas reçu de reconnaissance",
"rcvd-tab-label": "Reçu",
"sent-detail-amount": "Montant: ",
"sent-detail-amounts-label": "Montant",
"sent-detail-category-label": "Catégorie: ",
"sent-detail-date": "Envoyé: {{date}} ",
"sent-detail-message-label": "Message",
"sent-detail-recips-header": "Vous avez envoyé à",
"sent-detail-recips-label": "Destinataire",
"sent-tab-blank-msg": "Vous n'avez pas donné de reconnaissance",
"sent-tab-details-link": "Afficher les détails",
"sent-tab-label": "Envoyé",
"sent-tab-mltpl-recips-link": "plus"
},
"en-US": {
"form-amount-col": "Amount ({{minValue}}-{{maxValue}})",
"form-amount-total": "Total expense: {{totalExpense}}",
"form-balance": "Your new balance: {{balance}}",
"form-balance-low-error": "Balance is too low",
"form-category-select-label": "Category",
"form-confirm-amount-total": "Total expense",
"form-confirm-amounts-label": "Amount",
"form-confirm-balance": "Your new balance",
"form-confirm-category-label": "Category",
"form-confirm-message-label": "Message",
"form-confirm-recips-label": "Recipient",
"form-confirm-title": "Confirmation",
"form-confirm-warn": "Please review before sending! Once sent, it cannot be undone.",
"form-exchange-label": "Program",
"form-exchange-select-label": "Select Program",
"form-invalid-amount-error": "Enter a valid amount",
"form-invalid-comment-error": "Comment is required",
"form-invalid-recipients-error": "Recipients are required",
"form-message-label": "Message",
"form-next-button": "Next",
"form-recips-label": "Recipient",
"form-recips-select-label": "Recipients",
"form-same-amounts-checkbox": "Same amount for recipients",
"form-sent-again-link": "Send another",
"form-sent-button": "Done",
"form-sent-label": "Sent!",
"form-submit-button": "Submit",
"header-send-rec-button": "Send a recognition",
"header-title": "Recognition",
"navigation-previous-page": "Back",
"rcvd-detail-amount": "Amount: ()",
"rcvd-detail-category-label": "Category: ",
"rcvd-detail-date": "Received: {{date}}",
"rcvd-detail-message-label": "Message",
"rcvd-detail-sender-label": "You received from",
"rcvd-tab-blank-msg": "You haven't received a recognition",
"rcvd-tab-label": "Received",
"sent-detail-amount": "Amount: ",
"sent-detail-amounts-label": "Amount",
"sent-detail-category-label": "Category: ",
"sent-detail-date": "Sent: {{date}} ",
"sent-detail-message-label": "Message",
"sent-detail-recips-header": "You sent to",
"sent-detail-recips-label": "Recipient",
"sent-tab-blank-msg": "You haven't given a recognition",
"sent-tab-details-link": "Show details",
"sent-tab-label": "Sent",
"sent-tab-mltpl-recips-link": "more"
},
"es-MX": {
"form-amount-col": "Cantidad ({{minValue}}-{{maxValue}})",
"form-amount-total": "Gasto total: {{totalExpense}}",
"form-balance": "Tu nuevo saldo: {{balance}}",
"form-balance-low-error": "El saldo es demasiado bajo",
"form-category-select-label": "Categoría",
"form-confirm-amount-total": "Gasto total",
"form-confirm-amounts-label": "Cantidad",
"form-confirm-balance": "Tu nuevo saldo",
"form-confirm-category-label": "Categoría",
"form-confirm-message-label": "Mensaje",
"form-confirm-recips-label": "Destinataria",
"form-confirm-title": "Confirmación",
"form-confirm-warn": "¡Por favor revise antes de enviar! Una vez enviado, no se puede deshacer.",
"form-exchange-label": "Programa",
"form-exchange-select-label": "Seleccionar programa",
"form-invalid-amount-error": "Introduce un importe válido",
"form-invalid-comment-error": "Se requiere comentario",
"form-invalid-recipients-error": "Se requieren destinatarias",
"form-message-label": "Mensaje",
"form-next-button": "Próxima",
"form-recips-label": "Destinataria",
"form-recips-select-label": "Destinatarias",
"form-same-amounts-checkbox": "Misma cantidad para los destinatarios",
"form-sent-again-link": "Envie otro",
"form-sent-button": "Hecho",
"form-sent-label": "¡Enviada!",
"form-submit-button": "Entregar",
"header-send-rec-button": "Enviar un reconocimiento",
"header-title": "Reconocimiento",
"navigation-previous-page": "Atrás",
"rcvd-detail-amount": "Cantidad: ()",
"rcvd-detail-category-label": "Categoría: ",
"rcvd-detail-date": "Recibida: {{date}}",
"rcvd-detail-message-label": "Mensaje",
"rcvd-detail-sender-label": "recibiste de",
"rcvd-tab-blank-msg": "No has recibido un reconocimiento",
"rcvd-tab-label": "Recibida",
"sent-detail-amount": "Cantidad: ",
"sent-detail-amounts-label": "Cantidad",
"sent-detail-category-label": "Categoría: ",
"sent-detail-date": "Enviada: {{date}} ",
"sent-detail-message-label": "Mensaje",
"sent-detail-recips-header": "enviaste a",
"sent-detail-recips-label": "Destinataria",
"sent-tab-blank-msg": "No has dado un reconocimiento",
"sent-tab-details-link": "Mostrar detalles",
"sent-tab-label": "Enviada",
"sent-tab-mltpl-recips-link": "más"
}
}
See also