Guide: Trigger Criteria

To create a new trigger, refer to this article Creating a trigger. 

In this guide, you’ll find details on how to properly use the trigger criteria and how they work with your campaigns. The criteria are shown by trigger criteria type in dedicated categories.

On the platform, from the trigger builder left-side menu, you can use the carets to open or close the trigger category or use the search bar on the top to easily find the criteria you need.

Category Devices

Devices Criteria

The device criteria are both segmentation criteria and triggering criteria.  

It allows you to create a trigger to fire a campaign according to the device your visitors use during their visit.

🤖 Configuration

To target specific groups of visitors based on their device type, you will need to use the "Is" and "Is not" operators in the device criteria.

• “Is”: will include the selected value
• “Is not”: will not include the selected value  

Then, select the device you want to include or exclude (according to your previous selection) in the second drop-down list: 

• “On mobile”: user using their mobile device when visiting your website
• “On tablet”: user using their tablet device when visiting your website 
• “On desktop”: user using their desktop when visiting your website

When you want to target specific device types, for example, "mobile" and "tablet", you will need to exclude the third device type, which in this case would be "desktop".

If you want to exclude 2 device types, you will need to include the third one. For example, in the scenario provided, mobile visitors are included. Therefore, desktop and tablet visitors are excluded from the targeting.

💡 Use case

You want to display a message encouraging users of your mobile website to download the mobile application instead to have a better experience. In this case you need to display the campaign to mobile users only. To do so, select is > on mobile in the segment of your campaign.

⚙️ How does it work?

We store the device information in the session storage inside the “ABTastyUA” location. We call a specific service on our side to write and assign a value inside that variable, usually when the first page of the session loads. Three values are assignable:

• ‘Mobile phone’
• ‘Tablet’
• ‘Desktop’ 

When you manually QA a campaign, make sure to clear your storage if you artificially change your user agent (using the mobile mode from the browser for example). That way, AB Tasty will assign a new value in ‘ABTastyUA’ as it was your first visit. 

To interpret the browser user agent, AB Tasty uses an external service called “Device Atlas”, which allow us to do the conversion between the user agent and our homemade values. 

Screen size criteria

The Screen size triggering criteria enables you to scope the visibility of your campaign to visitors that use a certain type of screen.

🤖 Configuration

To set screen size criteria, select whether you want to include (is) or exclude (is not) a particular size. Then, you must enter both a minimum AND a maximum width (in pixels) for the targeted screens.

Good to know 💡
Minimum and maximum values are included (and coincide with ‘maximum or equal’ and ‘minimum or equal’). 

To help you choose the right screens, here is a table, including the most common Apple screen sizes available on the market:

💡 Use case

Consider you want to scope the visibility of your pop-in to tablets, but only on “big screens”. To do so, apply the following steps:

1. In the trigger builder, drag and drop the first criteria “Device” and select "is" and "on tablet" 
   
   
2. Drag and drop the Screen size criteria in the "AND" section and enter 2048px as a minimum value and 2224px as a maximum value.
   
   
   

Results: Only tablets with screens from 2 048px to 2 224px will be targeted.

Category Visitors

IP Address

The IP address criteria allow you to set a campaign for visitors with the same IP address. This criteria applies regardless of the device used to view the campaign (mobile, tablet or desktop). If you are running the QA process from a tablet or a smartphone, make sure you are using the same Wi-Fi network as your desktop computer.

🤖 Configuration

To configure the IP address criteria, select if you want to include (is) or exclude (is not) an IP address.

Choose Visitor for a single IP address or Range for multiple IP addresses.

Then, enter the right addresses in the value field. 

👉 Visitor

When selecting the visitor option, you can either target your IP address (which can be shared with a network) or a specific IP address (other than the one linked to your network).

👉 Range
When selecting the range option, you need to enter the first and last IP addresses of the range. This will trigger all the IP addresses belonging to a sub-network.

Good to know 💡

Your network’s IP address is detected by default. You can copy it and use it to make a campaign visible only to people using the same IP address as you. You can also target several addresses at once. To do so, click add condition and enter the IP address. If two or more IP addresses are configured, at least one of these IP addresses will be targeted.

💡 Use cases

• This criteria is mainly used for running a campaign through the QA process, and is directly available in the QA step for that matter. 
• Another use case could be to display a coupon code to the employees of your company only. To do so, go to the IP address criteria (Trigger) and select “is” > "visitor", and enter the IP address that is shared with your network. 

⚙️ How does it work?

When the IP criteria are used, we call a specific service on our side. Then we write the information of the IP directly on the browser side, inside a session storage’ new object called “ABTastyGeoloc”. Of course, this service works only if the consent has been previously given by your visitor. To transform an IP to a readable targeting criteria, we translate those into specific integers that you could review inside your browser.  

When manually performing quality assurance (QA) on a campaign, it is important to clear your storage in order to account for any changes in your IP address, such as if you are using a floating address. This will ensure that AB Tasty assigns a new value to ABTastyGeoloc, as if it were your first visit. This step will help you to test the campaign as a new visitor would.

Geolocation

The geolocation criteria enables you to trigger your campaign based on specific geographic location. This location is determined through your visitor's IP geolocation, that we can collect as soon as we get his/her consent. 

🤖 Configuration

• First, choose whether to include or exclude a specific location by selecting the "Is" or "Is not" operator.
• Next, select the level of granularity for your targeting, ranging from country to city.
• In the next step, select the country you want to include or exclude (as determined by your previous selection) from the drop-down list.
• Finally, you can refine the targeted audience by selecting a specific region, sub-region, and city.

Good to know 💡

• To target a specific country and exclude a specific region or city within that country, you need to use the "Is not" operator and select the specific region or city to exclude. For example, to target visitors located in the United States, except for those located in New York City, you would select "Is not" > "United States of America" > "New York (region)" > "New York (city)".
• The "Is" and "Is not" operators allow you to include or exclude specific countries in your targeting. "Is" includes a specific country, "Is not" excludes a specific country. For example, "Is" for France will target only visitors located in France and exclude visitors located in other countries, including Belgium. "Is not" for Belgium will include visitors located in all countries except Belgium. This way, you can set one option to include or exclude other countries, instead of configuring two rules separately.

💡 Use case

Let’s imagine that you want to promote a new physical store in Miami, that just opened for your customers. If you want to display a popup on your website to communicate on it, for all users located in Florida, you need to:

• Create a new personalization campaign 
• Inside the editor step, choose the widget that fits best what you want to display to your visitors (ex: a banner)
• Inside the targeting step of that campaign, choose through the geoloc criteria the “Florida” location. To do so, select “is” > “United States of America” on the country step, then > “Florida” in the region step

  To create a new trigger, refer to Creating a trigger

Weather

The weather criteria enable you to test or personalize your visitors' experiences based on real-time weather data. 

🤖 Configuration

AB Tasty offers you different dimensions to work with based on weather conditions. In the first field, you’ll be offered to either include or exclude the audience you’ll be configuring. Then, two main elements will help you define your trigger: 

• A specific type of weather: You can choose between Clear, Clouds, Drizzle, Dust, Fog, Mist, Rain, Smoke, Snow, Thunderstorm, or All.
  
• A range of temperature: select here the range of temperature you want your campaign to be based on, starting from the minimum value to the maximum value of this range
• If you put only one min temperature, the targeting will be done on all the values equal to or above that value.
• If you put only one max temperature, the targeting will be done on all the values equal or under that value.

💡 Use case

The weather criteria is a key pillar in terms of personalization and will help you build a strong strategy based on what your visitors are experiencing in real-time. Let’s imagine a big drop in temperature in mid-season. You could promote and display with ABTasty a specific card or banner on your website to highlight your snow/winter coats with specific price discounts. 

Inside the trigger builder, you can proceed as follows:

1. Select the weather criteria 
2. Select the “is” operator 
3. Select the “Snow” type of weather 
4. The range could go from 0F° to 32F°

With that kind of configuration, your campaign will be displayed only when your visitors are exposed to snowy conditions 😎

🤖 How does it work?

To display the right temperature metric (either Celsius or Fahrenheit), ABTasty refers to your language settings. We will display Fahrenheit by default if your langage configured is the english, and Celsius for the other langages. The trigger will automatically use the right reference system.

Weather detection goes through a few different steps:

1. We interpret the visitor geolocation from its IP 
2. We call a specific service called “Open weather map” to know what is the current weather on that particular geolocation
3. We store this information in the session storage, inside the same object as the Geoloc one (“ABTastyGeoloc”)

This specific weather service is called only when our tag detects the weather triggers being used in one active campaign on your account. When the session is initiated, the tag checks if we already have the information stored in the session storage. If not, he proceeds with the weather verification based on the user’s IP (only if we have his/her consent) that we described before. 

Category Source & pages

Landing page

The landing page criteria allow you to trigger your campaign depending on which page your visitor landed on first during their visit to your website. 

🤖 Configuration

First, you will have to choose which operator you want to use to identify a page or a set of pages. Once you do, you can proceed and enter the specific URL or piece of URL that will identify the page(s) to target, depending on the operator chosen.  

🤖 How does it work?

The ABTasty tag captures every session’ first URL and stores it at the beginning of the session inside one of our cookies: “ABTastySession”. This information is always stored, for each and every session. 

Source type

The Source type criteria are based on the source type of the visit. It can be an organic, a referral, or direct visit.

🤖 Configuration

To include two source types, you can directly exclude the third one. For instance, if you want to trigger your campaign when visitors are coming from a referral or an organic source, you need to exclude the direct source type.

On the other hand, if you want to exclude two source types, you need to include the third one. 

🤖 How does it work?

We store the information and collect it from the browser. When a session is initiated, we store what is called the “referrer” page URL, communicated by the visitor's browser, inside the “ABTastySession” cookie. This information is collected only if one active campaign is using the “source type” trigger. 

The different source types are defined as follows: 

• Direct: if there is no referrer URL at all 
• Organic: if there is any search engine reference inside the URL
• Referral: if any of the first two conditions are fulfilled

Source

The Source criteria enables you to trigger your campaign when visitors are coming to your website from a specific source determined by the referrer of the page. It allows you to precise a bit more your targeting than using the “source type” trigger, as you are able to fill in 

🤖 Configuration

You can start by selecting the right operator to validate your trigger configuration. Once you do, you just have to declare the right piece of URL, that refer to the targeting you want to create. 

Heads up ⚡

If you want to test the referrer URL which ABTasty use for this trigger, you just have to type “document.referrer” in the console and you’ll find it:

💡 Use case

You can choose to trigger your campaign only when visitors are coming from Instagram in order to display a specific message to your Instagram followers and promote a specific game that you are currently reserving for this social network. 

To do so, select the Source criteria and select contains > Instagram.

People coming from other sources (Facebook, direct access, organic, etc.) won’t be included in the targeting and thus won’t see the contest.

Previous page

The previous page criteria allow you to trigger your campaign based on a specific “previous page” URL. That will allow you to capture your visitor in specific and determine the navigation context. 

🤖 Configuration

First, you will have to choose which operator you want to use to identify the page or a set of pages. Once you do, you can proceed and enter the specific URL or piece of URL that will identify the page(s) to target, depending on the chosen operator.  

💡 Use case

Through the previous page criteria, you can trigger the campaign for the visitors that just left your cart process. To do that, you can go through the following steps:

1. Declare your cart URL as the previous page 
2. Exclude the section after the cart page, to avoid display your campaign to user that proceed with the normal checkout procedure

🤖 How does it work?

The ABTasty reads that information directly from the browser current page’ “document.referrer”. If there is no value in that object, the ABTasty tag gets the value from one of its specific resources (window.ABTasty.urlHistory.previous).

URL Parameter

The URL Parameter criteria enables you to restrict the visibility of a campaign to visitors depending on the composition of their URL parameter(s) when they visit your website.

A URL parameter is a way of passing on information about an event through a URL. They are commonly used for tracking and analytics. Parameters are located at the very end of the URL or within the path, depending on how the URL has been built. URL Parameters include a key paired with a value. A URL parameter begins with a question mark (‘?’) and each one is separated by an ampersand (‘&’). They can also be dynamically set in the path as values, separated by slashes and other characters (depending on the system used and how it’s implemented). These key/value pairs are used to track campaigns such as acquisition or emailing campaigns. 

For example, in the following URL: 

In this example, the parameters are as follows: 

🤖 Configuration

To configure the URL Parameter criteria, choose whether you want to include (is) or exclude (is not) a key (ex: utm_source) and enter the value of this key if there is one (ex: google).

Good to know 💡
For the name and value of the parameter, you need to enter the string without “?” and “=” characters. This triggering criteria only work with query parameters such as “?”. It doesn’t work with hash “#”).

💡 Use case

Let’s say you want to trigger your campaign on VIPs users that come from a specific newsletter you have sent your VIP clients. These people have received an email with a specific key (for example utm_campaign) and value (for example VIPParis) appearing in the URL of their webpage. To trigger your campaign for this traffic source only, in the URL parameter trigger, you need to specify the key and value related to this email. In this example, it will be utm_campaign and VIPParis.

🤖 How does it work?

The ABTasty tag reads that information directly from the DOM “window.location.href” element. 

Minimum Pages viewed

The minimum pages viewed is a criteria that allows you to trigger your campaign based on a specific number of pages viewed by your visitors. It helps build your strategy around visitors' engagement wherever our tag can count those visited pages. 

🤖 Configuration

You have to first select the right operators. You have two solutions, either: 

• Is equal to or greater than 
• Is equal to or lower than 

In the value field, you just have to declare the right number of pages that will fit your use cases. 

💡 Use case

Let’s imagine you want to target visitors that wander on your website. You could set a trigger based on your average number of visited pages’ number to identify visitors that spend more time than average. If that number is “5”, you could set the configuration to “6” to display the campaign to visitors that exceed that number. 

🤖 How does it work?

ABTasty gets this information from our main “ABTasty” cookie. We have a specific key “pvis” (that stands for “Pages viewed in Session”) that stores this information. Every time a visitor visits a new page, this number is incremented. 

Visited pages

The Visited pages triggering criteria enables users to trigger a campaign to visitors that have seen specific URLs at least a specific number of times during their current session.

🤖 Configuration

To configure the Visited pages criteria, you must specify the number of times a URL (or several URLs) has been seen during the session. To do so, select a number from the drop-down menu.

Then, you must declare one or several URLs by selecting the right URL operator from the drop-down list and entering the corresponding string (an entire URL, a regex, a part of a URL, and so on, depending on the operator you have chosen). You also have the option to use previously saved pages as resources to use in your trigger. 

Good to know 💡

The way it works is the same as in the Where section. 

💡 Use case

Imagine you have identified all your top product references and saved a specific saved page for that context. In the visited pages, you could target the visitors that visited a specific amount of time on those pages (for example here 2). The given campaign will be triggered only when your visitors will reach the amount of two pages viewed from your top product line. 

You can also mix up this trigger with specific targeting from the “where” section. Let’s say you want to display a coupon code on the cart page that would trigger only for visitors who saw a page containing “/recipe/” in their URL during their session:

1. Choose the visited pages triggering criteria in the How section of the targeting step of your campaign
2. From the first drop-down list, select the number of times the URL has been seen (in this case, select 1)
3. Select contains > /recipe/
4. In the Where section, select the is the operator and enter the URL corresponding to the cart page

🤖 How does it work?

The visited Pages criterion is based on information stored in the visitor’s browser' local Storage. Our tag creates a specific object called “ABTastyData” to collect different information on the visitor journey. For that matter (and for other targeting use cases), we store the following information in that object: 

• Page URL
• Page title
• Current session number
• Current timestamp

Technically and for confidentiality reasons, the “visited pages”  criteria will be restricted to the subdomain only, to respect specific browser policies. That means even if the tag is implemented on the +1 subdomain, the page’ count will be specific to each subdomain. 

Category Recurrence

Same day visit

The Same day visit-triggering criteria enables you to trigger a campaign to visitors that have already visited your website at least once in the past 24 hours. It can be their second, third, fourth,... Session.

🤖 Configuration

When you add this criterion to the trigger section of your campaign, it will automatically be activated once you launch your campaign. You don’t have to configure anything. The AB Tasty tag simply checks whether the visitor has already visited the website:

• If he had never visited the website, the visitor won’t be targeted by the campaign.
• If he had already visited the website, AB Tasty checks if his last session took place less than 24 hours ago:
• If he visited the website more than 24 hours ago, the visitor isn’t targeted
• If he visited the website less than 24 hours ago, the visitor is targeted 

💡 Use case

If you want your hesitating visitors to engage more and buy on your website, you can display a special coupon code during their second session within 24 hours. To do so, choose the Same day visit triggering criteria in the How section of the targeting step of your campaign. This way, all visitors who return to your website less than 24 hours after their first session will be targeted and will benefit from this coupon code.

🤖 How does it work?

ABTasty gets this information from our main “ABTasty” cookie. We have a specific key called “pst” (that stands for “Previous Session timestamp”) that stores the precise date and time of the visitor's last visit. We then do a basic calculation when a campaign uses this criterion, to determine whether it has been more or less 24 hours since the visitor's previous visit.  

Category Browser

Browser language

The Browser language triggering criteria enables you to include or exclude the browser language used by the visitors during their current session.

🤖 Configuration

To configure the Browser language criteria, select if you want to include (is) or exclude (is not) a specific browser language. Then, select the language you want to include or exclude (according to your previous selection) in the second drop-down list. If you include a specific browser language, all the other languages will automatically be excluded from the targeting. Conversely, if you exclude a specific browser language, the other languages will be included in the targeting of your campaign.

💡 Use case

You may want to display a message to your most engaged users who speak English. In this case, you need to display the campaign to loyal users using English as their browser language. To do so, select “English” in the Browser language triggering criteria and choose Loyal in the Engagement level segmentation criteria of your campaign.

🤖 How does it work?

ABTasty gets this information from the browser’s “navigator.language” variable. 

Browser

The Browser triggering criteria enables you to include or exclude the web browser used by visitors for their current session. 

🤖 Configuration

To configure the Browser criteria, select if you want to include (is) or exclude (is not) a specific web browser. Then, select the browser you want to include or exclude (according to your previous selection) in the second drop-down list. 

The browsers listed are the following: Chrome, Firefox, Safari, Microsoft Edge, and UC Browser. This is a non-exhaustive list as you can select another browser using the Custom option.

If you include a specific browser, all the other browsers will automatically be excluded from the targeting.

On the contrary, if you exclude a specific browser, the others will be included in the targeting of your campaign.

Browser version

For Safari, you can refine the criteria by selecting a specific browser version.

To include a browser except for a specific version, start by including the browser, then exclude the browser version from the targeting. For example, if you want to target visitors using Safari except version 6 of the browser, select is > Safari > add condition > is not > Safari > 6. This way, all browsers will be included in the targeting, including people using versions 7, 8, 9, 10, 11, and 12 of Safari. Other browsers such as Chrome and Firefox also have different versions, but require users to update their devices quite often. Visitors on Chrome or Firefox often use the latest version of the browser.

Custom browser

Each version of each browser has a specific value that differentiates them from each other. This is called the userAgent. If you want to use a browser that is not on the list of browsers, you need to use the Custom option.

To configure this option, you need to enter the value corresponding to the userAgent of the desired browser in the Enter browser field. 

To find this value, you can either check the browser’s console or consult a userAgent database.

Good to know 💡

In the Enter browser field, you can type either character strings or a regex.

For example, if you want to target visitors using Opera, which is not on the list of the most common browsers, you need to use the Custom option.

To do so, select it in the first drop-down list and Custom in the second one. Then, in the Enter browser field, type OPR. To include a specific version of Opera (Opera 70 for example), you need to use the following regex in the Enter browser field: OPR\/70.

💡 Use case

You may want to display a message to warn your visitors that the widget they want to use on your website is not compatible with Safari. In this case, you need to display the campaign to users browsing Safari.

To do so, select is > Safari in the Browser triggering the criteria of your campaign.

🤖 How does it work?

ABTasty gets this information from our session storage “ABTastyUA” object. We call for the first time an external service called “Device Atlas” that helps us get the language information from user agent description and analysis. We store two pieces of information:

• Browser name
• Browser version  

Adblocker

The Adblocker triggering criteria enables you to include or exclude visitors who have an adblocker on their browser to trigger your campaign.

🤖 Configuration

To configure the Ad Blocker criteria, select the Adblocker trigger in the list of triggers and select if you want to include (is) or exclude (is not) browsers using an adblocker.

If you include browsers using an Adblocker, the campaign will be triggered only when the adblocker of the visitors’ browser is enabled on their active session. Conversely, if you exclude browsers using an Adblocker, the campaign will be triggered only when the adblocker of the visitors’ browser is disabled on their active session.

💡 Use case

For example, you want to display a message on your website to warn your users that they need to disable the adblocker on their browser to be able to watch a video.

In this case, you need to display the campaign to visitors who use an adblocker on their browser. To do so, select it in the adblocker triggering criteria of your campaign.

If visitors disable the adblocker of their browser after they see the message, they won’t see the message anymore and will be able to watch the video. If they enable the adblocker again afterwards, they will see the message again.

Category Expert

JS Variable

This criteria allows you to verify a specific JS variable of your choice. 

🤖 Configuration

You will need first to configure the right operator ABTasty will have to look after. Only two are available on that use case: “is” and “is not”. Once you have made your choice, you can declare the variable ABTasty will have to look for when parsing the DOM of the page. It has to strictly respect the naming convention that you used to be able to securely detect it. 

Then, you have to choose from a second operator list. Depending on the type of data your JS is manipulating, you can either choose:

• “Equal” or “does not equal”
• “Contains” 
• “Is regular expression”
• “Lower than” or “higher than”
• “Is declared”

To finalize your configuration, you will need to declare the right variable value you are expecting to have to fire the campaign. 

The JS variable criteria allows you to mix up different variables with both a “some” and “all” calculation approach, giving you a wide range of possibilities to create highly personalized triggers. 

As your variable could be used and transformed through your visitor navigation, three options are offered to check this trigger at the right moment:

• When the page loads: means our tag will not be able to check new declared values between two pages visited
• Every {X} ms until the conditions are met: meaning our tag will operate a regular check to detect any changes on that specific variable
• According to a custom JS event. You can find everything in our developer documentation about the custom event that allows you to restart the targeting verification

💡 Use case

Let’s imagine that you set up a boolean “productInteraction” variable in your code base to know if a specific visitor has already interacted with one of your products (for example size, a shipping verification, or anything that could grow your business). 

In AB Tasty, you can then create a trigger based on that JS variable, and use it in one of your campaigns to wait for one of these interactions to trigger it. 

🤖 How does it work?

Our tag is doing “window.variableName” to search for a specific variable like anyone could do through the browser console. 

Code-based option

The code-based option enables you to insert JavaScript code to trigger a campaign depending on the presence of a specific JS instruction. This option is compatible with other options in the section, except the “target all URLs” option that you find in the “where” section of the targeting. 

🤖 Configuration

This option can be used in the Where section as an option as well as in the How section as a triggering criterion.

When using this option, you must comply with the following rules:

• Do not use a function(){ at the beginning of your code.
• The function/condition your code must return a true or false value.
• If you plan to use jQuery, you must enable the use of jQuery via Settings. In this case, go to Account management > Framework and select Load AB Tasty’s jQuery.

If you use this option, keep in mind that some elements can be called after the page has been initially loaded, or after the visitor carries out certain actions on your website. In this case, the targeting conditions must be verified at regular intervals until they are met.

As for the “JS variable” triggering criteria, you can use our specific targeting verification event. Or, you can use promises with the abResolve keyword, which is better for performance purposes.

💡 Use case

This option can be useful in many interesting cases such as:

• To target visitors who have a specific cart amount
• To target visitors who have a specific number of items in their cart
• To trigger a campaign after a visitor has spent a specific amount of time on the website
• To trigger a campaign after a visitor has clicked a button with a specific class.

Let’s say you want to display a banner on your cart page for visitors who have a minimum amount of €50 in their cart. As this targeting criterion does not exist, you need to use JavaScript code to get the total cart amount directly on the page, using querySelector or a dataLayer. Then, it will be able to automatically check if the amount is greater (the function returns true and the campaign can be displayed) or lower (the function returns false and the campaign is not displayed) than €50. To do so:

1. Click the code option from the Where section.
2. Enter the following code (for example):
   if (document.querySelector('.cart_total') && parseFloat(document.querySelector('.cart_total').textContent) >= 50) {
   return true
   }
3. Enable a targeting verification to detect this code variation

Let’s say you want to trigger your campaign when a visitor clicks a button whose class is “btn”. As this targeting criteria do not exist, you need to use JavaScript code to automatically check if the visitor has clicked (the function returns true and the campaign can be displayed) or hasn’t clicked (the function returns false and the campaign are not displayed) a button with the btn class. To do so:

1. Click the code option from the Where section.
2. Enter the following code (for example):
   window.addEventListener("DOMContentLoaded", () => {
   Array.from(document.getElementsByClassName("btn")).map(
     e => e.addEventListener("click", (event) => {
     console.log("Hello World " + JSON.stringify(event))
     abResolve(true)
   }))
   });

This code includes the use of a promise (with the abResolve keyword) which means you don’t need to go through the targeting verification custom events.

🤖 How does it work?

The code you create is on our side encapsulated in a function that must return either “true” or “false” (as we previously mentioned, this is why as well you do not need to declare the function type of convention). This function is run by the tag to be executed and serve its targeting purposes. 

CSS selector

Use the CSS selector option if you want to trigger your campaign only when the loaded page contains an element linked to a specific ID or class. This option is fully identical to the CSS/ class/element you can configure in the Where section of the targeting step. 

💡 Use case

For example, you want to create a specific carousel on the homepage of your website for clients who have a gold membership. The only element that differentiates a gold member from a “standard” member is an icon located in the header of your website. Gold members have a specific menu/section listing all their advantages. On the website, this section is coded with an ID called #menu-gold. 

In this case, you need to identify the sessions when this specific ID appears, this is your campaign trigger. To do so, choose CSS selector, select Include > ID, and select the relevant ID from the drop-down list. 

Let's see how to use it effectively according to your website.

🔍 Inspecting your webpage to find valuable elements

Inspect your webpage : right click (or Ctrl+Shift+C) > Go to Elements tab

You can then inspect precisely elements of the page by pressing again the shortcut Ctrl+Shift+C or activating the inspect on hover option: 

It will allow you to highlight elements on your page and select them when clicking on them: 

You can then retrieve and copy easily a selector by right clicking on the element, select ‘copy’, then ‘copy selector’: 

⚠️ Keep in mind though that there are a lot of ways to build selectors according to the degree of precision and what you want to target. 

A copied selector may not be precise enough to distinguish an element from another.

To check it, you can press Ctrl+F to open a search bar and paste your selector to see the number of occurrences in the page: 

If you created your own selector, it will also show you if it is correct or not.

If you want to build your own CSS selector, we recommend getting help from a front-end developer or reading some external documentation (developer.mozilla or W3School).

🎯 Choosing between the operators ID/Class/Custom

ID : You can paste your ID with or without ‘#’. In the latter case, it will be automatically taken into account.

Class : You can paste your Class with or without a dot(.). In the latter case, it will be automatically taken into account.

Custom selector : To write or paste your own custom selector according to all the syntax rules of CSS. Don’t forget to add # or a dot(.) before an ID (#) or a class (.) when using this option.

🤖 Using the "After page load option"

According to your AB Tasty tag implementation and page load time, it can happen that the element you are targeting is appearing after the tag execution. In this case, you will be excluded from the targeting conditions even if the element is present on the page…
If you notice this, you can select this option: a verification after tag’s execution will be added to prevent it.

DataLayer

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

🤖 Configuration

To start using the dataLayer, 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. 

💡 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 would allow you to use that datalayer key to build specific targeting on top of it. You would just have to:

• In the key section, enter “customerType”
• Select the operator “equal”
• In the value section, enter “loyal”

As this could be a value that is calculated on each page load, you could stay on the “when the page loads” option. 

But let's go deeper in the setup if you do not know where to start and have a complete walkthrough below !

🔍 Finding your dataLayer on your website

First, inspect your webpage : right click (or Ctrl+Shift+C).

You can use the dataslayer Chrome extension to have a table view of your dataLayer > Inspect the webpage (right click or Ctrl+Shift+C) > dataslayer tab.

You can also find your dataLayer in your console tab: Inspect the webpage (right click or Ctrl+Shift+C) > console tab > write and enter “dataLayer” (without “apostrophes”) for GTM pushed dataLayers or “tc_vars” for TagCommander pushed dataLayers:

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

🎯 Retrieving a key or a value from your dataLayer

Identification and selection of the key
We will base our explanation on the example below: 

As you can see, a dataLayer, as the name suggests it, has multiple layers of information. Each layer is itself an information to build a path to retrieve precisely a value and build your targeting.

This works like the JS variable: the tag does detect the dataLayer through a normal browser facility. In your configuration, you can use the “.” 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 6.ecommerce.detail.products.0.brand) in the dedicated field:

Note : 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

To go back to our example and to target a precise value, apostrophes that you can read for the brand “DAILY” are not to be written in the criterion value field, instead write only DAILY as follows: 

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

🤖 Which options to verify the dataLayer targeting ?

As for the JS variable trigger criteria, three options are offered to check your data layer trigger at the right moment:

• When the page loads: means our tag will verify your dataLayer at pageload only, so no check of new declared values between two pages visited will be made.
• Every {X} ms until the conditions are met: meaning 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.

Configuring several conditions with ALL and SOME operators

All and Some are operators used between several conditions to build a segment, a trigger, to define the target pages, or to configure the QA of your campaign.

📖 Definition

All and Some operators enable you to combine several conditions within a set-up in the targeting step such as segmentation or triggering criteria. They appear in a drop-down list when two or more conditions are added. In most cases, both All and Some operators are available.

🤖 Configuration

Various use cases to combine conditions with All and Some operators

When the only available operator is Some 

For consistency purposes, come criteria cannot accept all operators.

For example, in the Geolocation criteria, you can add several conditions, but the default operator is some. Indeed, visitors cannot be in two different countries at the same time, during their session. If you select France as a first condition and the United States as a second condition, you will target visitors located either in France or in the United States.

When the only available operator is All 

For example, in the Last purchase segmentation criteria, you can refine the criteria by adding advanced criteria such as payment or delivery method. If you want to target visitors who made their last purchase less than 30 days ago and used PayPal as the payment method and the Welcomeback coupon code, only visitors who made a purchase within the last 30 days and both used the coupon code and the payment method mentioned above will be targeted.

Managing 2 or more exclusions: All only

When we use only exclusions, the drop-down displays all by default. 

For instance, if you want to target pages that contain neither the ”blue” string nor the “red” string, your 2 conditions will have to be met in order to trigger the campaign. Using some operator between those conditions would not make sense.

Managing a combination of inclusions and exclusions

This last use case combines inclusions and exclusions. 

Imagine you want to set up this targeting on your website: the campaign should appear on every product page, except pages from the “luxury” category.

Your setup will be the following: 

• Start by including your whole website by including URLs containing the “/product/” string
• Then, exclude URLs containing the “/luxury/” string.

To trigger the campaign, these are the steps the tag will follow:

• First, the AB Tasty tag will check if the current page contains the word “luxury”
• If it does, the tag won’t trigger the campaign.
• If it doesn’t, the tag will check if the URL contains “/product/”
• If it does, the tag will trigger the campaign
• If it doesn’t, the tag won’t trigger the campaign.

Good to know 💡

In all cases, all exclusions must be entirely respected. Regarding inclusions, this depends on your configuration (if possible): respecting at least one or absolutely all of the conditions.

Triggers execution in the tag

Some criteria can’t technically be checked at the load of the page when the tag tries to check the targeting conditions and execute the campaigns in case of conditions are met.
Please go back to the targeting guide, section “Defining targeting conditions” to get more information about this option.