> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.crisp.chat/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to display the Crisp chatbox situationally with Google Tag Manager data layers

*Learn how to use Google Tag Manager Data Layer values to adapt when the Crisp chatbox appears.*

When your website already exposes plan, pricing, account, or lifecycle data through the **Data Layer**, Google Tag Manager can use that context to decide which visitors should see Crisp or which custom script should run.

---

# ${color}[#0080dd](Before you start)

This setup is useful when your website already knows who the visitor is, for example an authenticated user with a plan, role, lifecycle stage, or monthly spend. You can then reuse those attributes in **Google Tag Manager** without editing the Crisp code directly every time.

__You will need:__
* **Crisp chatbox** installed on your website
* **Google Tag Manager** installed on the same pages
* User attributes exposed in the **Data Layer** or available from your website code
* A clear rule for when Crisp should load, show, hide, or trigger a specific action

|| Custom data can also be set directly with the Crisp JavaScript SDK, through the REST API, or by importing contact data. See [automatically setting custom user data](/en/article/how-can-i-automatically-set-custom-user-data-1xh7pqk/) if you want to store attributes in Crisp profiles.

---

# ${color}[#0080dd](Expose useful values in the Data Layer)

First, push the values you want Google Tag Manager to read. The example below exposes the visitor plan and price, but you can adapt the keys to match your own business data.

```html
<script>
  window.dataLayer = window.dataLayer || [];

  window.dataLayer.push({
    typePlan: "Essentials",
    price: "95"
  });
</script>
```

Make these values dynamic in your production code. For example, **typePlan** should come from the authenticated user account, not from a static snippet copied into every page.

---

# ${color}[#0080dd](Create Google Tag Manager variables and triggers)

#### ${color}[#445055](Open the Variables section)

In **Google Tag Manager**, open your container and go to **Variables**. This is where you will create variables that read the values pushed to the **Data Layer**.

![Google Tag Manager variables section](https://storage.crisp.chat/users/helpdesk/website/87ae2703583ac800/cleanshot-2025-02-24-at-115748_16i7pgy.png =1000xauto)

#### ${color}[#445055](Create a Data Layer variable)

Scroll to **User-defined Variables**, create a new variable, and choose **Data Layer Variable**. Use the same key name you pushed earlier, such as **typePlan** or **price**.

![Create a new Google Tag Manager variable](https://storage.crisp.chat/users/helpdesk/website/87ae2703583ac800/cleanshot-2025-02-24-at-115641_1twt3zc.png =1000xauto)

![Configure a Data Layer variable](https://storage.crisp.chat/users/helpdesk/website/87ae2703583ac800/cleanshot-2025-02-24-at-115704_kyxtut.png =1000xauto)

#### ${color}[#445055](Build a trigger from that variable)

Create a trigger that uses your new variable as a condition. For example, you can fire a Crisp-related tag only when **typePlan** is not **Free**, or when **price** is higher than a threshold you define.

![Create a trigger from Data Layer values](https://storage.crisp.chat/users/helpdesk/website/87ae2703583ac800/cleanshot-2025-02-24-at-115715_1ls5x36.png =1000xauto)

---

# ${color}[#0080dd](Connect the trigger to your Crisp setup)

Once the trigger is ready, attach it to the tag that loads Crisp or to the custom script that controls Crisp behavior. Depending on your setup, this can be used to load the chatbox only for a specific audience, show it on selected pages, or trigger a custom action after the chatbox is loaded.

Before publishing, use **Preview** mode in Google Tag Manager to confirm that your **Data Layer** values are present and that your trigger fires only for the visitors you expect.

| If Crisp is not installed yet, follow the guide on [adding the Crisp chatbox code to your website](/en/article/how-to-add-the-crisp-chatbox-code-to-my-website-10wcj3l/) before configuring advanced targeting rules.