# Integration with Google Tag Manager Section: Integrations Description: Send Tidio widget events to Google Tag Manager and configure triggers and variables. Verified against Tidio panel 12.331.0 Last updated: 2026-11-10 Source: https://help.tidio.com/articles/integration-google-tag-manager/ Tidio's integration with Google Tag Manager allows you to send events from the Tidio widget to dataLayer, and then from dataLayer through GTM to other services. **In this article, you'll learn:** - [How to integrate Tidio with Google Tag Manager]() - [How to set up the Tidio widget event listener]() - [How to create variables from Tidio events parameters]() - [What Tidio widget events are sent to Google Tag Manager]() ## How to integrate Tidio with Google Tag Manager To enable integration with GTM, go to the list of integrations in your Tidio admin panel and click on the Google Tag Manager tile. ![The Integrations analytics category shows the Google Tag Manager tile.]() Next, press **Connect Google Tag Manager**. ![The Google Tag Manager integration page shows its connect button with the relevant controls visible]() From now on, events from the Tidio widget will be sent to your dataLayer. Now you'll need to set up GTM in order to see Tidio widget events in the GTM. ## Setting up Tidio widget event listener Tidio events use a specific naming convention. Events names follow the structure: **tidio\_\{\{event\_category\}\}\_\{\{event\_action\}\}**, where: **tidio\_** - is a prefix that indicates the origin of the event. It will also be a prefix for custom events sent from flows. **\{\{event\_category\}\}** - indicates a category. we have identified three categories: - **widget** - groups actions that users can perform in a widget - **prechat** - refers to actions done with regard to the pre-chat survey - **conversation** - refers to actions done with regard to a conversation. These events can also be triggered by an agent or a flow, not necessarily a visitor. **\{\{event\_action\}\}** - refers to users/visitors, agents, automation action, e.g., started so there will be an event with the name \`tidio\_prechat\_started\`. Below is a cheatsheet with all events, parameters, and dataLayer.push calls of Tidio widget events. To catch all those events in Google Tag Manager, you'll need to set up a Trigger. To set up a trigger: 1. log in to your **Google Tag Manager** account and go to the **Triggers** section. ![Google Tag Manager navigation highlights Triggers.]() 2. Press **New** 3. As a name, you can set** Tidio Widget Events** 4. In the trigger type, select **Custom Event** 5. In the event name, paste **^tidio\_\\w+** and select **Use regex matching**. This will allow you to trigger all events that begin with **tidio\_ **, so you don't have to set up a trigger for every single event. ![A Google Tag Manager custom event trigger uses a regular expression for Tidio events.]() 6. Press **Save** To forward these events to GA4, first set up your Google tag in GTM. Create a **Google Analytics: GA4 Event** tag, enter your GA4 **Measurement ID**, and use the built-in **Event** variable for **Event Name**. Attach the Tidio custom event trigger under **Triggering**. Add the event parameters you need using the data layer variables described below. ![A Google Analytics event tag uses the Tidio widget event trigger in Google Tag Manager.]() Use **Preview** to test the tag on your website. After checking that it fires for Tidio events, click **Submit**, select **Publish and Create Version**, and click **Publish**. Saving a tag alone does not make it active on your website. ![Google Tag Manager preview shows a Tidio conversation rating event.]() ## Creating variables from Tidio events parameters We send not only events but also parameters inside them. You can pick them up with GTM and save them as variables that can be used in Tags or Triggers. To create a Variable: 1. Log in to **Google Tag Manager** 2. Go to **Variables** **![Google Tag Manager navigation highlights Variables.]()** 3. Press **New** in **User-Defined Variables** 4. Select **Data Layer Variable** for variable type ![The variable type menu highlights Data Layer Variable.]() 5. Paste the name of the variable from the list of **Tidio Widget Events** variables. ![A Google Tag Manager data layer variable is configured for a Tidio rating.]() 6. Name your variable and click **Save**. Repeat for each parameter you want to use. Now, you can use both Tidio events and parameters as triggers and variables for tags from GTM. ## Tidio Widget Events sent to Google Tag Manager We use dataLayer.push method to send events from the Tidio widget to GTM. Below you'll find information on what events, what parameters, and when they are sent. #### **Tidio Widget GA4 Events** **Name** | **Event theme** | **GA4 Event parameters** | **Description** | **GTM example AP****I call** tidio\_widget\_mute\_notifications | Widget | visitor\_id | A visitor mutes notifications. | dataLayer.push(\{ event: "tidio\_widget\_mute\_notifications", visitor\_id: "a0488de5553843668d061d961468f224" \}) tidio\_widget\_open | Widget | visitor\_id | A visitor opens Tidio widget. | dataLayer.push(\{ event: "tidio\_widget\_open", visitor\_id: "a0488de5553843668d061d961468f224" \}) tidio\_widget\_close | Widget | visitor\_id | A visitor closes Tidio widget. | dataLayer.push(\{ event: "tidio\_widget\_close", visitor\_id: "a0488de5553843668d061d961468f224"\}) tidio\_widget\_visitor\_started\_bot | Widget | visitor\_id | A visitor started a flow intentionally. | dataLayer.push(\{ event: "tidio\_widget\_visitor\_started\_bot", visitor\_id: "b42c892b2804493d882b550511806aee" \}) tidio\_prechat\_started | Pre-Chat | email, phone, name, visitor\_id, consent\_given | Pre-chat survey is displayed to a visitor. | dataLayer.push(\{ event: "tidio\_prechat\_started", email: true, phone: true, name: true, consent\_given: true, "gtm.uniqueEventId": 10 \}) tidio\_prechat\_finished | Pre-Chat | email, phone, name, consent\_given | A visitor has submitted pre-chat survey. | dataLayer.push(\{ event: "tidio\_prechat\_finished", email: true, phone: true, name: true, consent\_given: true, "gtm.uniqueEventId": 9 \}) tidio\_conversation\_\{\{custom\_event\}\} | Conversation | | A custom event sent by a flow through **Send an event to Google Analytics**. | dataLayer.push(\{event: "tidio\_conversation\_custom\_event" \}) tidio\_conversation\_started | Conversation | source, operator\_status, chatbot\_name, message\_type, visitor\_id | The first message in the thread is sent by the visitor, agent, or flow. | dataLayer.push(\{ event: "tidio\_conversation\_started", visitor\_id: "a0488de5553843668d061d961468f224", source: "chatbot", chatbot\_name: "Welcome new visitors", message\_type: "text", operator\_status: "online" \}) tidio\_conversation\_rated | Conversation | rating, visitor\_id, thread\_id | A visitor has rated a conversation using emojis. | dataLayer.push(\{ event: "tidio\_conversation\_rated", thread\_id: 15550, visitor\_id: "a0488de5553843668d061d961468f224", rating: 5 \}) ## Further reading - [Integration with Google Analytics (GA4)]() [Set up Google Analytics events in Tag Manager in the vendor help center]().