Setting up ChatLab for GDPR compliance – Load After Consent

Setting up ChatLab for GDPR – Load After Consent
Default ChatLab Script
CookieBot Integration
Step 1: Declare the loadChatLab function in a blocked script
Step 2: Add event listeners for consent updates
Usercentrics Integration
Step 1: Register a custom service in your Usercentrics dashboard
Step 2: Declare the widget loader
Step 3: Listen for Usercentrics consent changes
Google Tag Manager Integration
Step 1: Declare Tags
Step 2: Create a trigger to call loadChatLab()
Step 3: Create a trigger to call unloadChatLab
Summary

Setting up ChatLab for GDPR – Load After Consent

Following GDPR regulations, certain types of scripts — including marketing tools — must only be loaded after the user has given explicit consent, especially when used for marketing or tracking purposes.

If you're using ChatLab on your website and treating it as a marketing-related tool, you should ensure it does not load automatically before consent is granted.

Default ChatLab Script

Default ChatLab integration loo like this:

<script>
  window.aichatbotApiKey = "YOUR_API_KEY_HERE";
  window.aichatbotProviderId = "f9e9c5e4-6d1a-4b8c-8d3f-3f9e9c5e46d1";
</script>
<script src="https://script.chatlab.com/aichatbot.js" id="YOUR_API_KEY_HERE" defer></script>

This script loads immediately, regardless of the user's cookie or tracking preferences

Your API Key is in fact chatbot id that you can find on your main chatbot screen.

Below you'll find tested and working methods to delay the script until consent is granted using CookieBot, Usercentrics, and Google Tag Manager (GTM).

CookieBot Integration

Step 1: Declare the `loadChatLab` function in a blocked script

Add the following script somewhere on your page. CookieBot will block this until the user gives marketing consent.

<script type="text/plain" data-cookieconsent="marketing">
  window.loadChatLab = function () {
    if (document.getElementById("YOUR_API_KEY_HERE")) return;

    window.aichatbotApiKey = "YOUR_API_KEY_HERE";
    window.aichatbotProviderId = "f9e9c5e4-6d1a-4b8c-8d3f-3f9e9c5e46d1";

    var script = document.createElement("script");
    script.src = "https://script.chatlab.com/aichatbot.js";
    script.defer = true;
    script.id = "YOUR_API_KEY_HERE";

    document.body.appendChild(script);
  };

  window.unloadChatLab = function () {
    var existing = document.getElementById("YOUR_API_KEY_HERE");
    if (existing) existing.remove();
    delete window.aichatbotApiKey;
    delete window.aichatbotProviderId;
  };
  
  window.loadChatLab();
</script>

Step 2: Add event listeners for consent updates

<script>
  function checkCookiebotConsent() {
    if (Cookiebot.consents?.marketing && typeof window.loadChatLab === "function") {
      window.loadChatLab();
    } else if (typeof window.unloadChatLab === "function") {
      window.unloadChatLab();
    }
  }

  window.addEventListener("CookiebotOnConsentReady", checkCookiebotConsent);
  window.addEventListener("CookieConsentDeclaration", checkCookiebotConsent);
</script>

Usercentrics Integration

Step 1: Register a custom service in your Usercentrics dashboard

Name: ChatLab
Category: Marketing
Behavior: Block execution until consent is granted

Step 2: Declare the widget loader

Place the following script in your site. This function will be triggered manually based on consent state.

<script>
  window.loadChatLab = function () {
    if (document.getElementById("YOUR_API_KEY_HERE")) return;

    window.aichatbotApiKey = "YOUR_API_KEY_HERE";
    window.aichatbotProviderId = "f9e9c5e4-6d1a-4b8c-8d3f-3f9e9c5e46d1";

    var script = document.createElement("script");
    script.src = "https://script.chatlab.com/aichatbot.js";
    script.defer = true;
    script.id = "YOUR_API_KEY_HERE";

    document.body.appendChild(script);
  };

  window.unloadChatLab = function () {
    var existing = document.getElementById("YOUR_API_KEY_HERE");
    if (existing) existing.remove();
    delete window.aichatbotApiKey;
    delete window.aichatbotProviderId;
  };
</script>

Step 3: Listen for Usercentrics consent changes

<script>
  function checkUsercentricsConsent() {
    const services = window.UC_UI?.getServicesBaseInfo?.() || [];
    const hasConsent = services.some(
      (s) => s.name === "ChatLab" && s.consent.status === true
    );

    if (hasConsent && typeof loadChatLab === "function") {
      window.loadChatLab();
    } else if (typeof unloadChatLab === "function") {
      window.unloadChatLab();
    }
  }

  window.addEventListener("UC_UI_INITIALIZED", checkUsercentricsConsent);
  window.addEventListener("UC_UI_CONSENTS_UPDATED", checkUsercentricsConsent);
</script>

Google Tag Manager Integration

If you’re using GTM (with either CookieBot or Usercentrics or any other CMP tool), you can still load ChatLab conditionally.

Step 1: Declare Tags

Go to Tags > New
Tag type: Custom HTML
set the name to Load ChatLab
Paste in this HTML:


<script>
  window.loadChatLab = function () {
    if (document.getElementById("YOUR_API_KEY_HERE")) return;

    window.aichatbotApiKey = "YOUR_API_KEY_HERE";
    window.aichatbotProviderId = "f9e9c5e4-6d1a-4b8c-8d3f-3f9e9c5e46d1";

    var script = document.createElement("script");
    script.src = "https://script.chatlab.com/aichatbot.js";
    script.defer = true;
    script.id = "YOUR_API_KEY_HERE";

    document.body.appendChild(script);
  };
  
  window.loadChatLab();
</script>

Create another tag, named Unload Chatlab

<script>
  window.unloadChatLab = function () {
    var existing = document.getElementById("YOUR_API_KEY_HERE");
    if (existing) existing.remove();
    delete window.aichatbotApiKey;
    delete window.aichatbotProviderId;
  };
  window.unloadChatLab();
</script>

Step 2: Create a trigger to call `loadChatLab()`

Go to Triggers > New
Name trigger something like: Consent - Marketing Accepted
Choose Trigger Type: Custom Event
Set Event name to:

CookieConsentDeclaration

Under This trigger fires on, choose:

Some Custom Events
Condition:

CookieConsent marketing equals true

This trigger will only fire when the CookieConsentDeclaration event occurs and the user has accepted Marketing cookies.

Associate the trigger with the ChatLab loading tag

Edit your Load ChatLab tag

In Triggering, choose the trigger you just created:

Consent - Marketing Accepted

Step 3: Create a trigger to call `unloadChatLab`

Follow same steps to create trigger that will execute the code for unloading chatlab in case the consent is changed

Summary

To comply with GDPR:

Declare loadChatLab() in a blocked script or global scope
Use your consent manager (CookieBot, Usercentrics, or GTM) to check for marketing consent
Only load ChatLab once the user gives permission
Unload or block the widget when consent is denied or withdrawn