Oracle VBCS
Enhancing User Experience through Localization in VBCS
Localization helps a Visual Builder application serve users in different languages and regions without duplicating the application. The following strategy keeps interface text in translation bundles, selects a locale at runtime, and maintains consistent keys across every supported language.
Prerequisites
1. Configure Localization in app-flow.json
Add a localization property that reads the selected locale from browser storage and falls back to English when no preference exists.
"localization": {
"locale": "{{ window.localStorage.getItem('vbcs.languageSwitcherApplication.locale') || 'en' }}"
}2. Add a Language-Switch Method
Create a JavaScript method that saves the selected language in local storage. The application can then reuse the saved locale when it starts.
PageModule.prototype.setAppLanguage = function (selectedLocale) {
if (selectedLocale) {
window.localStorage.setItem(
'vbcs.languageSwitcherApplication.locale',
selectedLocale
);
}
};Steps for Applying Localization
Mark Labels for Localization
Select each component label in the UI Editor and use the Label Hint localization option. Only properly marked labels will be included in the translation JSON.
Create a Translation Key
Assign a clear, unique key to every translatable value, then save it. Consistent keys make translations easier to manage across the application.
Verify app-strings.json
Open the application strings file and confirm that each key exists and maps to the intended source value.
Open Application Settings
Use the application menu in the top-right corner and select Settings to manage language and translation resources.
Download All Strings
Open the Translations tab and download the All Strings JSON package so every localizable value can be reviewed and translated.
Extract the Translation Package
The download produces a ZIP containing the All Strings JSON and related localization resources. Extract it before editing.
Create the Language File
Duplicate the source strings file, add the target language suffix—for example, app-strings-ar.arb—and replace each value with its translated text while preserving every key.
Upload the Updated ZIP
Compress the modified localization folder, return to Settings → Translations, and upload the new ZIP through the upload area.
Verify and Restart
Confirm that the new language resources appear under the application strings directory, then restart and test the application to ensure translated values display correctly.
Localization Best Practices
Conclusion
A well-structured localization workflow makes VBCS applications easier to use across languages and regions. By centralizing strings, preserving translation keys, saving the selected locale, and validating each uploaded bundle, teams can deliver consistent multilingual experiences without maintaining separate applications.