# Google Analytics 4 with GTM

*Note: This is only needed if you have GA4 setup through GTM. If you have added the GA4 script tag directly in your HTML, the Optibase events will be sent automatically.*

#### Guide: Setting Up a GTM Trigger for Optibase Variant Shown Event

This guide will walk you through setting up a Google Tag Manager (GTM) trigger that fires when an Optibase variant is shown. Additionally, we will create a tag that sends an event to Google Analytics 4 (GA4).

**Step 1: Access GTM and Create a New Trigger**

1. **Log in to your GTM account** and open the container you want to configure.
2. **Navigate to Triggers** in the left-hand menu.
3. Click on the **New** button to create a new trigger.
4. **Name your trigger** (e.g., "Optibase Variant Shown Trigger").
5. Choose **Trigger Type: Custom Event**.

**Step 2: Set Up the Custom Event Trigger**

1. In the **Trigger Configuration**, set the **Event Name** to a custom name, such as `optibase_variant_shown`.
2. Choose **This trigger fires on: All Custom Events**.

**Step 3: Create a Custom HTML Tag to Listen for Optibase Variants**

1. **Navigate to Tags** in the left-hand menu.
2. Click on the **New** button to create a new tag.
3. **Name your tag** (e.g., "Optibase Variant Listener").
4. Choose **Tag Type: Custom HTML**.
5. Add the following HTML and JavaScript code to the HTML field:

```html
<script>
  (function() {
    function sendOptibaseEvent(variants) {
      variants.forEach(function(variant) {
        window.dataLayer.push({
          event: 'optibase_variant_shown',
          event_category: 'optibase',
          event_label: variant.userFriendlyTestId + ':' + variant.userFriendlyVariantId,
          shownVariant: variant
        });
      });
    }

    if (window.optibaseAddActiveVariantsListener) {
      window.optibaseAddActiveVariantsListener(sendOptibaseEvent);
    }
  })();
</script>
```

6. **Set the tag to fire on All Pages**.

**Step 4: Create Variables to Capture Event Data**

1. **Navigate to Variables** in the left-hand menu.
2. Click on the **New** button to create a new variable.
3. **Name your variable** (e.g., "`event_category`").
4. Choose **Variable Type: Data Layer Variable**.
5. Set the **Data Layer Variable Name** to `event_category`.
6. Repeat steps 2-5 to create another variable for `event_label`.

**Step 5: Create a GA4 Event Tag to Capture the Variant Data**

1. **Navigate to Tags** in the left-hand menu.
2. Click on the **New** button to create a new tag.
3. **Name your tag** (e.g., "GA4 Optibase Variant Event").
4. Choose **Tag Type: GA4 Event**.
5. Select your GA4 configuration tag in the **Configuration Tag** field.
6. Set the **Event Name** to `optibase_variant_shown`.
7. In the **Event Parameters** section, add the following parameters:
   * **Parameter Name**: `event_category`
     * **Value**: `{{event_category}}`
   * **Parameter Name**: `event_label`
     * **Value**: `{{event_label}}`
8. Click on **Triggering** and add the custom event trigger you created in Step 1 (e.g., "Optibase Variant Shown Trigger").

**Step 6: Publish Your Changes**

1. Click on the **Submit** button in the top right corner of the GTM interface.
2. Follow the prompts to publish your changes.

**Final Check**

* **Preview your GTM container** to ensure that the custom event fires correctly when an Optibase variant is shown.
* **Check GA4** to verify that the events are being recorded as expected.

By following these steps, you will have set up a GTM trigger that listens for Optibase variant events and sends the relevant data to GA4.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.optibase.io/integrations/google/google-analytics-4-with-gtm.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.