Creating Data Layer Variables

Data layer variables empower ClickFlare Tag Manager to extract values from your data layer implementation and transmit them to tags, triggers, and other variables. A data layer object consists of a series of key/value pairs, where each key represents a category of information, such as a book's category, title, or author. Each key can have various corresponding values; for instance, the key for a book's title might hold values like 'Ulysses', 'War and Peace', 'A Brief History of Time', and so on.

Adding Data Layer Code to Your Web Page

The initial step in setting up the ClickFlare data layer involves embedding the ClickFlare container script into your website. After integrating the script, you can conveniently access the data layer directly from your browser's console using the following command:

window.clickflare()

Upon executing the preceding command, you will gain access to all ClickFlare built-in variables.

Add data to the data layer using the window.clickflare.push() command:

<a href="#" onclick="dataLayer.push({
         'bookCategory': 'Historical Fiction', 
         'bookTitle': 'Chronicle in Stone', 
         'bookAuthor': 'Ismail Kadare' 
});">Book details</a>

Refer to the developer documentation for comprehensive insights into data layer implementations.

Configuring the Data Layer Variable

After identifying the desired key, proceed to establish a data layer variable:

1. Click on Variables.
2. Select + New Variable.
3. Choose Variable Configuration and opt for Data Layer Parameter as the variable type.
4. In the Data Layer Variable Name field, input the key exactly as it appears in the code (e.g., bookTitle, not book title).
5. Save the variable.
6. Repeat these steps for each data layer key you wish to utilize as a variable in ClickFlare Tag Manager.
7. Publish the container.

Processing of Data Layer Information

Upon loading a container, ClickFlare Tag Manager commences processing all queued data layer push messages. These messages are processed sequentially, adhering to a first in, first out approach. If a message represents an event, any tags with met trigger conditions will fire before proceeding to the subsequent message.

Any tag() or window.clickflare.push() calls made by page code, Custom Templates, or Custom HTML tags will result in the associated message being queued for processing after all other pending messages have been evaluated. Consequently, updated data layer values may not be instantly available for the subsequent event. To address this, consider appending an event name to a message upon pushing it to the data layer, and subsequently monitor that event name using a Custom Event trigger.

Related Sources:

• Components of ClickFlare Tag Manager
• Built-in variables