Website Copilot

If your website supports multiple languages and you'd like your CustomGPT.ai Website Copilot 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 Website Copilot (e.g., for English) on your page as usual. This is done with the Website Copilot snippet. Paste this anywhere in your HTML where the bot should appear:

<button data-cgpt-ai-assistant data-cgpt-default-button='true' hidden>
	Ask Website Copilot
</button>
<script src="https://cdn.customgpt.ai/js/ai-assistant.js" defer="" p_id="AGENT_1_ID" p_key="AGENT_1_KEY"></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('cgpt-ai-assistant-iframe');
    if (isAgent1) {
      iframe.src = 'https://app.customgpt.ai/projects/AGENT_2_ID/ask-me-anything/?rs=ai-assistant&embed=1&shareable_slug=AGENT_2_KEY';
    } else {
      iframe.src = 'https://app.customgpt.ai/projects/AGENT_1_ID/ask-me-anything/?rs=ai-assistant&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!