In this article, you'll learn how to place the correct language chat widget in Google Tag Manager for multilingual websites, especially when your domain supports multiple languages (such as with /nl/ and /en/ appended).
While your Pulse chatbot automatically responds in the language the question is asked, the chat widget is set in a single language. If your website is multilingual and allows users to select the language through, for example, a menu, it can be beneficial to create a separate chat widget for each language. The steps to display the correct chat widget on the right pages are described below.
Step 1: Create a new tag
Log in to Google Tag Manager and select the account where you want to add the tag. Go to the left menu and choose 'Tags.' Click 'New' in the upper right to create a new tag or stay in the Overview and click 'New tag' directly.
Step 2: Tag configuration
Give the tag a recognizable name, such as 'Chat widget - Website NL.' Choose 'Custom HTML' as the tag type. Place the code snippet of the chat widget under the HTML section. Check 'Support document.write.'
Step 3: Add a trigger
Add a trigger. Here, you'll configure where the code (and thus the chat widget) should be displayed on the website. Select the trigger type 'Page view.' Choose 'Some page views.' Configure the triggers as follows:
- Column 1: Page URL
- Column 2: contains
- Column 3: /nl/ (or the relevant language code for your website)
For websites where the widget should only appear on a specific domain, add an extra trigger:
Column 1: Page Hostname
Column 2: is equal to
Column 3: your domain (for us, this might be watermelon.ai, ensuring the chat widget is not displayed on other domains).
Step 4: Save
Save the new tag. Now, the chat widget is visible as you've just configured!
Repeat these steps for each chat widget, per language. This is an effective way to localize your website and display the correct language chat widget on each page of your website.