Live Chat

If your website supports multiple languages and you'd like your CustomGPT.ai Live Chat to match the selected language dynamically — without reloading the page — you're in the right place.

With a simple script and your multilingual toggle buttons, you can switch between different AI agents seamlessly.

Use Case

Your multilingual website has, for example:

• English version → served by Agent 1
• German version → served by Agent 2

Instead of reloading the page, this method lets you dynamically swap agents.

Step-by-Step Guide

1. Embed your default Live Chat (e.g., for English) on your page as usual. This is done with the Live Chat snippet. Paste this anywhere in your HTML where the bot should appear:

<script defer src="https://cdn.customgpt.ai/js/chat.js"></script> <script defer> (function(){ function init(){ CustomGPT.init({ p_id:'AGENT_1_ID', p_key:'AGENT_1_KEY' }) } document.readyState === 'complete' ? init() : window.addEventListener('load', init); })(); </script> 

Replace:

• AGENT_1_ID with your English project ID
• AGENT_1_KEY with the key for Agent 1

2. Add the Toggle Function

Paste this before the closing </body> tag of your HTML page:

<script>
  let isAgent1 = true;

  function toggleAgent() {
    const iframe = document.getElementById('cgptcb-chat-box-iframe');
    if (isAgent1) {
      iframe.src = 'https://app.customgpt.ai/projects/AGENT_2_ID/ask-me-anything/?rs=livechat&embed=1&shareable_slug=AGENT_2_KEY';
    } else {
      iframe.src = 'https://app.customgpt.ai/projects/AGENT_1_ID/ask-me-anything/?rs=livechat&embed=1&shareable_slug=AGENT_1_KEY';
    }

    isAgent1 = !isAgent1;
  }
</script>

Replace:

• AGENT_1_ID with your English project ID
• AGENT_1_KEY with the key for Agent 1
• AGENT_2_ID with your German project ID
• AGENT_2_KEY with the key for Agent 2

3. Attach toggleAgent() to Your Language Buttons

Hook the toggle function to your language change button(s). For example:

<!-- Language Toggle Button -->
<button onclick="toggleAgent()">Switch Language</button>

If you're using flags, dropdowns, or SPA language selectors, bind toggleAgent() to your language change logic.

Tips

• This setup supports two agents. For more languages, you can extend toggleAgent() with logic based on selected language codes.
• You can also store the current language in a variable or cookie if you want to remember it between sessions.

👍

Note:

When the user switches the language on your site, the bot will update immediately to respond in the correct language, all without reloading the page or disrupting the user experience!