# DataLayer criterion

The DataLayer criterion is a triggering criterion that enables defining a [segment](/assets-library/creating-and-managing-segments.md).

To learn how to create a segment, please refer to this [article](/web-experimentation-and-personalization/targeting-step/how-to-create-a-segment-who-section.md).

### Definition <a href="#h_01hhpygwdzt9fhcmk07n3wtz6n" id="h_01hhpygwdzt9fhcmk07n3wtz6n"></a>

DataLayers are widely used as live datasets on most websites. It’s always a critical set of data that can be a real goldmine in your experimentation and personalization strategy.

That’s why we build dedicated targeting criteria for you to leverage that precious information through ABTasty.

### DataLayer integration <a href="#h_01hhpygwdz33kbshnj8m6kc4rn" id="h_01hhpygwdz33kbshnj8m6kc4rn"></a>

To start using the dataLayer criterion, you will first need to choose which dataLayer is actively used on your website in the [ABTasty integration’ setting page](https://app2.abtasty.com/settings/integration/datalayer). You will have to choose from a list of four options:

* Google tag manager
* Tag commander
* Tealium
* Custom

The custom option will help you declare the right JS variable that stores your data on your website. Once you choose the right version for your context, you can use any key(s)/variable(s) to create dedicated triggers.

To connect your dataLayer with your AB Tasty account, go to the settings, section Integrations/ [dataLayer.](https://app2.abtasty.com/settings/integration/datalayer)

For more information about the dataLayer set-up, please refer to this [article](/integrations/integrations-general-information.md).

### Finding your dataLayer on your website <a href="#h_01hgh1gms6tftw11gnxnwdcmsk" id="h_01hgh1gms6tftw11gnxnwdcmsk"></a>

You can find your dataLayer in your console tab:

\- Inspect the webpage (right click or `Ctrl+Shift+C` or `Cmd+Shift+C`) > console tab

\- write and enter **`dataLayer`** for GTM pushed dataLayers

\- or **`tc_vars`** for CommandersAct (TagCommander) pushed dataLayers

\- or `utag_data` for Tealium pushed dataLayers

<figure><img src="/files/YwfHnUGZ3Rd0caxWwG66" alt="" width="563"><figcaption><p>dataLayer example</p></figcaption></figure>

For other dataLayer provider or custom-made, please refer to your own internal documentation.

### Retrieving a key or a value from your dataLayer <a href="#id-01hggzqjpgqegmq8njzwf5x552" id="id-01hggzqjpgqegmq8njzwf5x552"></a>

**Identification and selection of the key**

The following example demonstrates this process:

<figure><img src="/files/v4xK26d6p0mdYYV4kqzl" alt="" width="563"><figcaption></figcaption></figure>

As the name suggests, a dataLayer contains multiple layers of information. Each layer provides specific data that helps build a path to precisely target and retrieve values.&#x20;

### Creating a trigger with a dataLayer criteria <a href="#id-01j5p0xhbysfpa2aq1sy3sw8fx" id="id-01j5p0xhbysfpa2aq1sy3sw8fx"></a>

This works like the [JS variable criterion](/assets-library/creating-and-managing-triggers/list-of-trigger-criteria/js-variable-criterion.md): the tag will detect the dataLayer through a normal browser facility. In your configuration, you can use a dot `.` in the key field to detect specific levels in the context of nested objects. If our tag encounters an array, it digs into each object of the array to continue the nest and continues like that for every entry/level.

For example, if you want to target the key ‘brand’ and the value after it, you do not need to precise the array.

You will add the key `ecommerce.detail.products.brand` (and not `2.ecommerce.detail.products.0.brand`) in the dedicated field:

<figure><img src="/files/qurjlzXic7HI2C4dYRj3" alt="" width="563"><figcaption></figcaption></figure>

{% hint style="info" %}
If you want to target an object that is present under multiple arrays, you can do the same key targeting.
{% endhint %}

### Choosing the operator <a href="#h_01j5p1354ph683y6t32y3dcz7a" id="h_01j5p1354ph683y6t32y3dcz7a"></a>

You can choose a lot of operators according to your needs in the dedicated dropdown of the criterion form.

### **Selecting the value** <a href="#h_01j5p145vhy3pnab3rrxp4sgkp" id="h_01j5p145vhy3pnab3rrxp4sgkp"></a>

Returning to our example: to target a precise value, don't include the apostrophes you see around the brand “NIGHT” in the criterion value field. Instead enter only the string value: `NIGHT`&#x20;

<figure><img src="/files/uB7NABfilixddPiPtotT" alt="" width="563"><figcaption></figcaption></figure>

Keep in mind that for the operators `equals`, `does not equal`, `contains`, `does not contain`, you can add multiple values by writing them and press `Enter` on your keyboard.

These values will be checked together as alternative conditions (`or`).

Also, `lower than` operator is to be considered as a check strictly lower than the value selected.\
`Higher than` operator is to be considered as a check strictly higher than the value selected.

### DataLayer targeting verification options <a href="#h_01j5p14a8n19vaw8eay2hyvgxc" id="h_01j5p14a8n19vaw8eay2hyvgxc"></a>

As for the [JS variable trigger criteria](/assets-library/creating-and-managing-triggers/list-of-trigger-criteria/js-variable-criterion.md), three options are offered to check your dataLayer trigger at the right moment:

* **When the page loads:** our tag will verify your dataLayer at pageload only. No check of new declared values between two pages visited will be made.
* **Every {X} ms until the conditions are met:** our tag will verify your dataLayer at pageload AND will operate a regular check to detect any changes on that specific variable.
* **According to a custom JS event.** The tag will do the verification at its execution but will do a recheck when detecting a specific JS event. You can find everything in[ our developer documentation ](https://docs.abtasty.com/client-side/tag/tag-javascript-events#datalayer-last-entry-event)about the custom event that allows you to restart the targeting verification.

### **How to choose between these 3 options ?**

In most cases, the dataLayer key/value will populate at each pageload before AB Tasty script execution and targeting verification. Hence, the **default option is the verification of the dataLayer trigger "When the page loads" (1st option)**.

By selecting the 1st option, the dataLayer criterion in your targeting will be checked at ABTasty script execution at each pageload. No check will occur between pageloads.

If you noticed that **your dataLayer is updated after AB Tasty script execution**, please use the **2nd option**. Having a regular check until the dataLayer is populated is effective in this case.

If you want **your dataLayer to be checked at tag execution AND verified according to a custom JS event** implemented on your end, please use the **3rd option** and follow this [technical documentation](https://developers.abtasty.com/docs/tag/tag-javascript-events#targeting-check-or-recheck-).

### Use case <a href="#h_01hggw9c4byzr9j7hf15wv3g0q" id="h_01hggw9c4byzr9j7hf15wv3g0q"></a>

![](/files/TxdIYKbz3WBYDhzLc9Z8)

Let’s imagine that you develop a specific variable inside your datalayer called `customerType` to store different customer categories based on what they initiate on your website.

You want to personalize the journey of your most loyal visitor by pushing them specific offers or shipping facilities.

The ABTasty datalayer criteria lets you use datalayer keys to build specific targeting rules. To set this up:&#x20;

* Enter `customerType` in the key section
* Select the operator `equal`
* Enter `loyal` in the value section

Since this value may be calculated on each page load, you can keep the “when the page loads” option selected.

### Important note about Single Page Application Websites  <a href="#h_01j6d2nwgw90k82y2njrr4vhsm" id="h_01j6d2nwgw90k82y2njrr4vhsm"></a>

SPA websites change pages without triggering pageloads which affects dataLayer management and trigger criterion:

* **Non-SPA website:** the dataLayer is cleared and repopulated with updated information on each pageload
* **SPA website:** without proper configuration, the dataLayer is not erased at page changes. Different objects accumulate from page to page with their latest keys and values.

This creates serious problems for AB Tasty's dataLayer trigger for multiple reasons :

* **Framework limitations**: while the [automatic reload of the framework in AJAX (change of URLs) and other workarounds](/account/tag-integration/going-further-with-your-tag/how-the-ab-tasty-tag-is-designed-to-handle-single-page-apps-spa.md) do great for SPA website, they don't solve datalayer trigger issues.
* **Stacking behavior**: datalayer keys/values are not updated (cleared and repopulated) on page changes. They just accumulate.
* **Incorrect targeting**: AB Tasty's tag crawls the datalayer from top to bottom to find matching keys. In SPAs with stacked objects, it finds the first matching key, not the latest one.

**Looking for additional information?**

Submit your request at <product.feedback@abtasty.com>

Always happy to help!

![](/files/XTsBv0MXRudvQdNwEG43)


---

# 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.abtasty.com/assets-library/creating-and-managing-triggers/list-of-trigger-criteria/datalayer-criterion.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.
