Skip to content
intoCHAT

Google Tag Manager integration

Add an AI chatbot with Google Tag Manager

Load your intoCHAT agent on every page through a Custom HTML tag, without editing your site's templates. The snippet below passes the agent ID in a way GTM keeps.

Create your agent free

Last updated:

How intoCHAT works with GTM

Google Tag Manager lets you add scripts to your site from one place. intoCHAT works through GTM, with one detail that matters: GTM removes data attributes from script tags in Custom HTML tags, and the intoCHAT script reads its agent ID from exactly such an attribute. The snippet on this page avoids that by creating the script element with JavaScript, so the widget loads with the right agent. Everything else, from colors to knowledge, is managed in intoCHAT.

Install intoCHAT with Google Tag Manager

  1. Copy your agent ID

    In intoCHAT, open your agent's Share tab. The ID is shown on the WordPress Plugin card, and it is also the value of data-chatbot-id in the script tag.

  2. Create a DOM Ready trigger

    In your GTM container, go to Triggers and click New. Open Trigger Configuration, choose DOM Ready, leave it firing on all DOM Ready events, give it a name and save.

  3. Add a Custom HTML tag

    Go to Tags and click New. Open Tag Configuration, choose Custom HTML and paste the snippet below with your agent ID in place of YOUR_AGENT_ID. Select the DOM Ready trigger and save.

  4. Test in preview mode

    Start GTM's preview mode, open your site in the connected window and check that the tag fired and the chat bubble appears in the bottom corner.

  5. Submit and publish

    Click Submit, then Publish. The chat bubble now loads on every page that runs your GTM container.

The Custom HTML tag

<script>
  (function () {
    if (document.getElementById('intochat-embed')) return;
    var s = document.createElement('script');
    s.id = 'intochat-embed';
    s.src = 'https://www.intochat.ai/api/embed.js';
    s.setAttribute('data-chatbot-id', 'YOUR_AGENT_ID');
    document.body.appendChild(s);
  })();
</script>

Don't paste the plain script tag from the Share tab into GTM, because GTM strips its data-chatbot-id attribute. This version sets the attribute with JavaScript and skips loading if the widget is already on the page.

What the agent does on a site managed with GTM

  • Installs without a code deploy

    If your site already runs a GTM container, you can add, test and remove the agent from GTM without changing your site's templates.

  • Learns from your website

    Paste your site address and intoCHAT finds up to 500 pages through your sitemap and links, renders JavaScript-heavy pages and lets you pick what to include.

  • Collects leads

    A form inside the chat asks for an email address or phone number on rules you set. Leads are emailed to you and can be exported as CSV.

  • Runs actions on your page

    Client-side actions call JavaScript functions you register on your own page, and custom API actions let the agent call your HTTP API during a chat.

  • Matches your brand

    Set colors, avatar, launcher icon, tooltip text and position in intoCHAT. Changes apply without editing the GTM tag.

  • Shows what visitors ask

    Read every conversation with search and date filters, and follow conversations, messages and leads on the dashboard.

Frequently asked questions

Can I paste the normal intoCHAT script tag into Google Tag Manager?

No. GTM removes custom attributes such as data-chatbot-id from script elements in Custom HTML tags, so the widget would load without knowing which agent to show and no bubble would appear. The snippet on this page creates the script element with JavaScript and sets the attribute itself, which GTM leaves alone.

Which GTM trigger should I use for intoCHAT?

Use a DOM Ready trigger. The widget adds its bubble to the page body as soon as it runs, and DOM Ready fires after the browser has built the page, so the body is always there. To show the chat on some pages only, set the trigger to fire on some events and add a condition such as Page Path starts with /support.

Does loading intoCHAT through GTM slow down my site?

The page doesn't wait for it. GTM loads its container asynchronously, and a script element added with JavaScript doesn't block rendering. The chat window then runs in its own iframe served by intoCHAT, separate from your site's code.

Will the chat bubble appear twice on a single-page app?

No. The snippet checks for its own script element before adding it, so if the tag fires again on the same page, for example from a history change trigger, nothing new is added. Once loaded, the bubble stays until the next full page load, so page conditions only decide where it first appears.

Do I need to update the GTM tag when I change the agent?

No. The tag only carries your agent ID. Colors, position, welcome message, suggested questions and knowledge load from intoCHAT each time a page opens, so you don't need to publish a new GTM version.

My site has a Content Security Policy. What do I need to allow?

Allow www.intochat.ai for scripts, connections and frames. The widget loads its script from there, fetches its settings from the same domain and opens the chat in an iframe served by intoCHAT.

See it answer from your own website

Paste your website address and chat with an agent built from your pages. It takes about a minute.

Create your agent free

Free plan, no credit card needed.