Install with Google Tag Manager

If your site already uses Google Tag Manager, you can deploy the TalkingDot messenger as a Custom HTML tag without touching your site's code.

The tag code

In GTM, use this small loader rather than the plain script tag. It creates the script element itself and sets data-key in code, so it doesn't depend on how GTM copies attributes from Custom HTML. It also queues any TalkingDot(…) calls made before the messenger finishes loading.

<script>
  (function (w, d) {
    w.TalkingDot = w.TalkingDot || function () { (w.TalkingDot.q = w.TalkingDot.q || []).push(arguments); };
    var s = d.createElement('script');
    s.async = 1;
    s.src = 'https://talkingdot.com/widget.js';
    s.setAttribute('data-key', 'YOUR_WORKSPACE_KEY');
    d.head.appendChild(s);
  })(window, document);
</script>

Create the tag

1. Open your container at tagmanager.google.com and go to Tags → New. Name the tag something like "TalkingDot messenger".
2. Choose the tag type. Click Tag Configuration and pick Custom HTML.
3. Paste the loader from above and replace YOUR_WORKSPACE_KEY with your key. Leave "Support document.write" unchecked.
4. Add a trigger. Click Triggering and choose All Pages. To load it as early as possible, you can use Initialization - All Pages instead. Don't add History Change triggers for single-page apps: the messenger tracks route changes on its own.
5. Save the tag.
6. Test in Preview mode. Click Preview, enter your site's URL, and check that Tag Assistant lists the tag under Tags Fired. The launcher should appear on the previewed site.
7. Publish. Click Submit, add a version name, then Publish. Until you publish, only Preview mode loads the messenger.

Consent mode and cookie banners

The messenger sets no cookies. It keeps a visitor token in the browser's localStorage so conversations survive page loads. Whether that needs consent where you operate is your call, so follow your own privacy policy. If you only want the tag to fire after consent, use the tag's consent settings (under Advanced Settings) or a trigger from your consent tool. For details on what's stored, see Security, privacy & GDPR.

Optional: identify logged-in users via the data layer

Only do this if your server can compute user_hash, the HMAC of the user ID made with your workspace secret from Settings → Security. GTM runs in the browser and must never see the secret. See Identity verification.

1. Push the user to the data layer from your server-rendered page, above the GTM container snippet:

<script>
  window.dataLayer = window.dataLayer || [];
  window.dataLayer.push({
    talkingdot_user: {
      user_id: "42",
      email: "jane@example.com",
      name: "Jane Doe",
      user_hash: "computed on your server"
    }
  });
</script>
<!-- Google Tag Manager container snippet goes below -->

2. Create a variable. In GTM, go to Variables, click New under User-Defined Variables, choose Data Layer Variable, set the name to talkingdot_user, and save it as DLV - talkingdot_user.

3. Hand it to the messenger. Add these lines at the top of your tag's script, before the loader:

<script>
  var cnUser = {{DLV - talkingdot_user}};
  if (cnUser) window.TalkingDotSettings = cnUser;

  (function (w, d) {
    /* …the loader from above… */
  })(window, document);
</script>

A simpler alternative is to print window.TalkingDotSettings = {…} directly in your page, above the GTM snippet. The messenger reads it when it loads, wherever it came from.

Verify it works

1. Open your live site in a private window after publishing the container.
2. Look for the launcher bubble in the bottom-right corner, or on whichever side you chose, then send a test message. It appears in your Inbox.
3. Check Settings → Install in TalkingDot. It shows when the messenger was last seen on your site.

Troubleshooting

• Works in Preview but not live: the container version with the tag hasn't been published yet.
• Tag fires but nothing appears: check the browser console for TalkingDot: missing or invalid data-key. Also check whether a domain allow-list in Settings → Security leaves out this domain.
• Missing for some visitors: ad blockers often block Google Tag Manager itself, and everything it loads goes with it. If that matters to you, paste the snippet directly into your site instead. See Install on any website.
• Content-Security-Policy errors: allow https://talkingdot.com in script-src, connect-src and img-src, as described in Install on any website.

Next steps

• JavaScript API: call TalkingDot('track', …) from other GTM tags to record events on a contact.
• Identity verification: compute user_hash on your server.
• Proactive messages: target visitors by page, time on page or country.