Switch Language Feature with Multi-lingual Support
Intro
Create web apps in multiple languages that allows you to easily switch between languages based on preference; ensuring a personalized experience for a diverse audience.
In this video we will understand as how to build multi-lingual web applications with support of several languages and user can choose or switch language as per their preference.
For example, lets say you want to build web applications catering to German, Swedish and English speaking people, then you can have support of all these 3 languages and person can choose the language as per their preference.
1. Turn on Localization
To enable multi-lingual support go to Settings->App Setting->Advanced->Localization.
1.1 Add Langauge(s)
By default the language is English but you can add your preffered language and click Add Language.
1.2 Add Key(s)
Keys are unqiue values based on the chosen langauge. Click Add Key and give it a preferred name.
1.3 Edit the Key
You can go to Google Translate and change the name in the chosen language and click Update Value.
2. Link to Component
Go to Components and open its Settings. In the Get Content choose to fetch content from localization along with its description and Save the settings.
3. Preview/Publish the Changes
Choose Preview and it will display the chosen languages. The default one being English.
4. Create an Event to Switch Language
You need to create an event to switch language. Go to Events and choose Create Event. Name your event and click Create.In the event mention what it is supposed to do. Here in this case it you can Navigation -> Switch Language.
4.1 Add the Details
In the pop-up that appears choose the langauge you want to switch to and Save.
5. Bind the Event to the Button
Go to Components and drop a Link. Open its Settings and choose the event to link it to and Save.
6. Preview/Publish the Changes
Choose Preview and it will display the chosen languages when the respective button is clicked. The default one being English.
7. Create a Dropdown
Go to Components->Navbar->Sub Menu. Rename the dropdown and as done before bind the events to the respective langauges and Save.
8. Preview/Publish the Changes
Choose Preview and it will display the chosen languages. The default one being English.
Conclusion
One benefit of building multi-lingual web applications is enhanced accessibility, enabling users to interact with content in their preferred language, thus catering to a wider audience.