Multilingual Support in Live Chat Widget
In this article, you’ll learn how to:
- Enable multi-language support: Set up the live chat widget in various languages to facilitate global user interactions with your website.
- Display the widget in a specific language: Configure the widget to appear in the language preferred by users.
- Automatically adjust widget language to match the user’s browser preferences: Learn how to update the culture parameter in the widget URL dynamically, ensuring the widget matches the user’s browser language for a seamless and personalized experience.
Enabling multi-language support
Multi-language support in a live chat widget allows the interface and messages to be displayed in various languages. This feature ensures that users from different regions can interact with the live chat widget in their preferred language, providing a personalized customer experience.
For detailed instructions, refer to this article.
You can find the available language details in this article.
How to display the widget in a specific language
-
Navigate to Admin > Chat > Live Chat.
-
Copy the provided Embed Code as indicated in the following image.
-
Add the language code manually into the URL.
Example for French:
<script src="https://www.example.com/chatwidget-api/widget/v1/3bda8530-486e-4659-8eff-460dfb819682?culture=fr" defer async></script>Example for Japanese:
<script src="https://www.example.com/chatwidget-api/widget/v1/3bda8530-486e-4659-8eff-460dfb819682?culture=ja" defer async></script>
-
Embed the script on your website to display the live chat widget in a specific language.
Automatically adjust widget language with the user’s browser preferences
Follow these steps to automatically change the culture parameter of the widget based on the browser’s preferred language:
- Retrieve the preferred language by using the ‘navigator.language’ property.
- Construct the widget URL by appending the retrieved language as the ‘culture parameter’ in the widget URL.
- Add a script tag in your website to load the widget with the updated URL.
// Get the browser's preferred language
const preferredLanguage = navigator.language;
// Construct the widget URL with the culture parameter
const widgetURL = `https://www.example.com/chatwidget-api/widget/3bda8530-486e-4659-8eff-460dfb819682?culture=${preferredLanguage}`;
// Create a script tag to load the widget
const script = document.createElement('script');
script.src = widgetURL;
script.defer = true;
script.async = true;
// Append the script tag to the document head
document.head.appendChild(script);
If the culture code is not provided, English will load as the default language.