DataLayer criterion

This article will show you how to use this Trigger criterion.

The DataLayer criterion is a triggering criterion that enables defining a segment.

To learn how to create a segment, please refer to this article.

Definition

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

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. 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.

For more information about the dataLayer set-up, please refer to this article.

Finding your dataLayer on your website

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

dataLayer example

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

Retrieving a key or a value from your dataLayer

Identification and selection of the key

The following example demonstrates this process:

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.

Creating a trigger with a dataLayer criteria

This works like the JS variable criterion: 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:

If you want to target an object that is present under multiple arrays, you can do the same key targeting.

Choosing the operator

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

Selecting the value

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

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

As for the JS variable trigger criteria, 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 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.

Use case

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:

• 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

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 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 [email protected]

Always happy to help!