ePrivacy and GPDR Cookie Consent by Cookie Consent Skip to main content

Tab: Personalization/ Web banners

Personalization/ Web Banners tab enables creating and setting rules to display web banners on the website. 

The web banners feature allows you to create popup banners and display them to the users of your website.

Prerequisites to work with web banners are:

  • The Meiro Events SDK is enabled on the website and the Meiro Events instance is connected to Meiro Business Explorer.
  • The feature is enabled in Meiro Business Explorer by your administrator.

Both are usually set by the Meiro team. 

 

To display web banners on the web site, it is possible to set up rules under which the banners are displayed. Currently these are conditions which can be evaluated locally in the user’s browser—e.g. the specific page the user is on, the time of day, or the content of cookies.

Web banner form

Name web banner

(required)

The name under which the banner will be displayed in the list of banners. This name is only visible within Personalizaiton tab/ Web banners tab.

 

Warning:  depending on the reporting set for measuring web banners performance, changing of the name my influence the report  e.g. reporting may be set to track various version of web banners under various names. Since reporting is customized for each client, please contact Meiro team to check it ou

 

Conditions

Frequency

cap (optional)

The maximum number of times the banner will be shown to a particular user per a rolling 24 hour period. If the banner has been shown to this user this number of times in the past 24 hours, the banner will not be selected as a candidate for display.

 

Coming soon:

  • frequency cap per user for choosen hour/ day/ session,
  • frequency cap per user in total,
  • frequency cap per web banner in total to all users. 
Position (required)

The position where the banner will be located on the page: top left, top right, middle, bottom left, bottom right. 

 

For the position “middle”, the page will be covered with a semi-transparent overlay and the banner will be displayed on top of the overlay. If the user clicks anywhere outside of the banner, this will close the banner.

 

For the other positions, the banner will be displayed without an overlay and can only be closed by clicking the close button in the banner. These banners will be offset from the edge of the window by a 20-pixel gap.

 

Priority (required)

It is a number that defines priority for a display of a web banner. Priority can be set to a whole number between -10 and +10, where -10 is the lowest priority and +10 is the highest. 0 is the default priority.

 

The Meiro will only show one banner at a time to a user.

 

If there are multiple banners for which the display conditions are fulfilled, the banner with the highest priority will be displayed.

 

If multiple banners have their conditions fulfilled and have the same priority, the banner which has been shown to this user the least number of times in the past 24 hours will be selected.

HTML/ Image

(required)

There are two types of banners: image banners and HTML banners.

 

Image 

Image banners consist entirely of the specified image. After clicking on the web banners the user is directed to the specified destination URL (the new page will open in the same window as the current page).

The banner has a close button in the top right corner automatically included.

The dimensions of the image banner are the same as the dimensions of the specified image, but they are scaled down if the window is too small:

-On mobile phones, the image is scaled down to fit the window, leaving a 20-pixel gap from each edge.

-On other devices, the image is scaled down so that the width is at most 50 % of the window width and the height at most 50 % of the window height.

-Aspect ratio is always preserved.

 

Image URL: The URL of the image that will make up the banner.

Destination URL: The URL that the user will be taken to after clicking on the banner.

 

 

 

HTML

For HTML banners, content of the banner and the dimensions needs to be specified manually (see the section for developers for technical details about how the banners are included into the page).

 

 

Html: The source code for the banner. The maximum length of the HTML code is 100 000 characters.

See the section for developers for technical details about how the banners are included into the page. 

 

Width in pixels and height in pixels

The dimensions of the banner. If the window is too small, the banner is automatically scaled down to fit the window leaving at least a 20-pixel gap from each edge (aspect ratio is not preserved).

 

Enable close button

When enabled, the banner is displayed including the default close button in the top right corner. If disabled, this enables the developer to include their own close button. The Meiro SDK provides a method that can be called by this close button to close the banner (see the section for developers for more details)

 

 

Conditions

Conditions are rules that must be fulfilled in order for the banner to be considered for display (whether the banner will actually be displayed is then dependent on the frequency cap and priority).

 

If no conditions are set, the banner will always be considered for display and will only be limited by frequency cap and priority settings.

 

The conditions can be nested and the operators at each level of nesting set to either “and” (all conditions must be fulfilled) or “or” (at least one of the conditions must be fulfilled).

 

 

Hour

Browser language 

Browser language

Possible to set: equals/ doesn’t equal/ equals any of/ doesn’t equal any of for all languages form a drop down list.

 

The language of the user’s browser (retrieved from from window.navigator.language).

 

Only the first part of the language code (the two letter code as defined in in ISO 639-1) is considered considered—e.g. if the condition is set to equal “en”, the condition will be fulfilled by values “en”, “en-US”, “en-GB”.

 

Browser

 

Browser

Possible to set: equals/ doesn’t equal/ equals for Chrome, Edge, Firefox, Safari, Opera, other.

 

The user’s browser as detected from the user-agent string.

 

Cookie

 

Cookie

Possible to set: cookiecookie name, date type (boolean, datetime, number, string) and/ or operator (is set/ is not set and operators relevant for data type). 

 

This condition compares the value with the contents of a cookie set in the browser under the specified cookie name.

 

Date type can be taken from SDK javascript date constructor e.g.  new Date(whatever_is_the_cookie_value).

 

Note for developers: developers: the cookie must be accessible to JavaScript code, i.e. it must not be set as “http-only”.

See the ection developers documentationbelow  for a note about data types and operators.

 

 

Datetime

Datetime

Possible to set: since, until, since-until for date in format yyyy-mm-dd, hh:mm.

 

This condition compares the time of the pageview with an an absolute  point in time. Thetime—the evaluation doesn’t take into account the user’s timezone. At any given moment, it will evaluate the same for all users around the world.

 

In Meiro Business Explorer, input the datetime value in your own timezone.

 

Example:  You have a campaign that ends on a particular day at noon of US eastern time (ET). You want to stop showing a banner when the campaign ends. You are currently using Meiro Business Explorer from Prague (CET). You select the operator “until” and input the datetime in your timezone 6 PM (which equals noon in ET). On the given day, at noon ET (6 PM your time), users all around the world will stop seeing the banner at the same time, regardless of their timezone.

 

Day of the week 

week

Possible to set: equals/ doesn’t equal/ equals for Monday - Sunday.

 

This condition takes the user’s timezone into account—i.e. which day of the week it is for the user.

 

Device

Device

Possible to set: equals/ doesn’t equal/ equals for console, desktop, embedded, mobile, smart tv, tablet, wearable.

 

The user’s device as detected from the user-agent string.

 

Google Tag Manager

Possible to set:  name of GTM DL object, GTM DL key, datatype (boolean, datetime, number, string), operator (is set/ is not set).

 

This condition compares the value with the contents of an entry in the GTM data layer.

 

Name of GTM DL object:  type in the name of the data layer object as it is instantiated in the website e.g. if your data layer object is accessed under under window.dataLayer, input “dataLayer”.

 

GTM DL key:  type in the key of the data entry whose value you want to compare against.

 

See section the section for developerbelow  for a note about data types and operators.

Hostname

Possible to set: equals/ don’t equal/ equals 

 

 

Hostname

Possible to set: equals/ don’t equal/ equals. 

 

The hostname of the page, as retrieved from from window.location.hostname  i.e. the part of the URL address excluding the protocol prefix (“https://”) and excluding the path (the “/” after the top-level domain and any following text).

 

Hours of the day

Possible to set: equal/ doesn’t equal, until, since, since-until, for hours from 0-23.

 

This condition takes the user’s timezone into account—i.e. which hour of the day it is for the user e.g. if set to “equals 16”, this condition will pass if it’s between 16:00:00 and 16:59:59 for the user.

 

HTTP

HTTP request 

This condition makes a request to the provided URL. If the response from the server has an OK status code (>= 200 and < 400), this condition passes.

 

Use values from cookies and local storage in the HTTP request by including placeholders in the URL in the format format {{cookie:my_cookie_name}}  for cookie values and and {{ls:my_ls_key}}  for local storage.

 

Note for developers:  The values from cookies/local storage are encoded using the JavaScript function function encodeURIComponent()  before being inserted into the URL.

 

Example:  On the page you have a cookie with the name “last_order_id” and value “123”, and local storage item with the key “user_email” and value “user@example.com”. Type in the URL URL “https://my-api.com/orders/{{cookie:last_order_id}}?email={{ls:user_email}}”. The Meiro Events SDK will make a request to https://my-api.com/orders/123?email=user%40example.com. If the response returns OK, this condition will pass.

 

Local storage

Possbile to set: local storage key, data type (boolean, string, number, datetime), operator (is set/ is not set). 

 

This condition compares the value with the contents of a local storage item set in the browser under the specified key. 

 

Date type can be taken from SDK javascript date constructor e.g.  new Date(whatever_is_the_cookie_value).

 

See section the section for developersbelow for a note about data types and operators.

 

Operating system

Possible to set: equals/ doesn’t equal/ equals for Android, iOS, MacOS, Windows, others.  

The user’s operating system as detected from the user-agent string.

 

Page title

Possible to set: is set, is not set, equals/ doesn’t equal/ equals any of / doesn’t equal any of, contain/ doesn’t contain.

The page title (retrieved from from document.title).

 

Pathname

Possible to set: is set, is not set, equals/ doesn’t equal/ equals any of / doesn’t equal any of, contain/ doesn’t contain.

 

Pathname

The pathname of the page, as retrieved from from window.location.pathname  i.e. the part of the URL address including the “/” after the top-level domain and any following text, but excluding the query, the part of the URL starting with “?”, if there is any.

 

Referer

Referrer

Possible to set: is set, is not set, equals/ doesn’t equal/ equals any of / doesn’t equal any of, contain/ doesn’t contain.

The value of the “referrer” part of the query in the URL address.

 

URL 

URL

Possible to set: is set, is not set, equals/ doesn’t equal/ equals any of / doesn’t equal any of, contain/ doesn’t contain.

The entire URL address of the page the user is on (retrieved from from window.location.href).

 

 

UTM campaign, UTM medium, UTM source

Possible to set: is set, is not set, equals/ doesn’t equal/ equals any of / doesn’t equal any of, contain/ doesn’t contain.

 

The value of the “utm_campaign”/ “utm_medium”/ “utm_source” part of the query in the URL address.

 

Remember: stringsstrings are  converted to lowercase. When evaluating conditions which compare strings of text, all strings are compared as as case insensitive.

Remember: Enter datetime in your local timezone. It will be automatically converted to the customer's timezone. 

 

Cookie, local storage, and Google Tag Manager condition data types and operators

FrequencyFor capconditions (optional)

based on cookie/local

Thestorage/GTM maximumvalues, numberit is possible to select the expected data type of timesthe value retrieved. If no data type is selected, you can choose the banneroperators “is set” and “is not set”, which will test whether there is a value stored under that name at all. If you select a data type, you will then be able to select from operators available for that data type.

Warning: If the value is not set, all comparisons will be shownevaluated as false. If you want to abe particularable userto perdistinguish a rolling 24 hour period. If the banner has been shown to this user this number of times in the past 24 hours, the banner will not be selected as a candidate for display.. 

 

Coming soon:

  • frequency cap per user for choosen hour/ day/ session,
  • frequency cap per user in total,
  • frequency cap per web banner in total to all users. 
Position (required)

The positionscenario where the bannervalue is willset but doesn’t beequal your locatedprovided onvalue, theis page:it toprecommended left,you topset right,up middle,two bottomconditions: left,one bottom right. 

 

For the positionformiddle”is set”, the page will be covered with a semi-transparent overlay and the banner will be displayed on top of the overlay. If the user clicks anywhere outside of the banner, this will close the banner.

 

For the other positions, the banner will be displayed without an overlay and can only be closed by clicking the close button in the banner. These banners will be offset from the edge of the window by a 20-pixel gap.

 

 

Priority (required)

It is a number that defines priority for a display of a web banner. Priority can be set to a whole number between -10 and +10, where -10 is the lowest priority and +10 is the highest. 0 is the default priority.

 

The Meiro will only show one banner at a time to a user.

 

If there are multiple banners for which the display conditions are fulfilled, the banner with the highest priority will be displayed.

 

If multiple banners have their conditions fulfilled and have the same priority, the banner which has been shown to this user the least number of times in the past 24 hours will be selected.

 

 

HTML/ Image

(required)

There are two types of banners: image banners and HTML banners.

 

Image 

Image banners consist entirely of the specified image. After clicking on the web banners the user is directed to the specified destination URL (the new page will open in the same window as the current page).

The banner has a close button in the top right corner automatically included.

The dimensions of the image banner are the same as the dimensions of the specified image, but they are scaled down if the window is too small:

-On mobile phones, the image is scaled down to fit the window, leaving a 20-pixel gap from each edge.

-On other devices, the image is scaled down so that the width is at most 50 % of the window width and the height at most 50 % of the window height.

-Aspect ratio is always preserved.

 

Image URL: The URL of the image that will make up the banner.

Destination URL: The URL that the user will be taken to after clicking on the banner.

 

 

 

HTML

For HTML banners, content of the banner and the dimensions needs to be specified manually (see the section for developers for technical details about how the banners are included into the page).

 

 

Html: The source code for the banner.comparison Theyou maximumwant lengthto ofmake.

the
HTML code is 100 000 characters.

See the section for developers for technical details about how the banners are included into the page. 

 

Width in pixels and height in pixels

The dimensions of the banner. If the window is too small, the banner is automatically scaled down to fit the window leaving at least a 20-pixel gap from each edge (aspect ratio is not preserved).

 

Enable close button

When enabled, the banner is displayed including the default close button in the top right corner. If disabled, this enables the developer to include their own close button. The Meiro SDK provides a method that can be called by this close button to close the banner (see the section for developers for more details)