Articles in this section
Category / Section

Multilingual Support in Live Chat Widget

Published:
New

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

  1. Navigate to Admin > Chat > Live Chat.

    BoldDesk's Live Chat Widgets Admin Page

  2. Copy the provided Embed Code as indicated in the following image.

    Live Chat Embed Code Page

  3. 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>

  1. Embed the script on your website to display the live chat widget in a specific language.

    Multilingual Live Chat Widget

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:

  1. Retrieve the preferred language by using the ‘navigator.language’ property.
  2. Construct the widget URL by appending the retrieved language as the ‘culture parameter’ in the widget URL.
  3. 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.

Was this article useful?
Like
Dislike
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied