Marketing Overlays allow you to display an image or HTML to site visitors when they enter or leave Permutive segments. Let's dive into each one in more detail,

Image Overlays

Image overlays show an image, which when clicked takes the user to a URL of your choice.

To create an Image Overlay, you need to have a URL for an image you've hosted somewhere, and the link you wish the image to follow. It's very simple to set up.

Here's some more information about each of the fields you need to fill in:

Image URL: The URL of the image you want to display in the overlay

Image Link: The URL you want the user to go to, when they click the overlay.

Opacity: How transparent you want the background behind the overlay to be.

Transition Speed: The time you want it to take for the overlay to fade in and out.

Target this reaction to: The segment you want to see this reaction.

On Entry / On Exit / Every Time: When you want the overlay to be displayed. On entry to a segment, when a user exits a segment, or every time they visit a page while in that segment.

Variants: Covered in Reporting below

Context Criteria: Explained below

HTML Overlays

HTML overlays are similar to Image Overlays, but allow you to insert custom HTML instead of static images. Again, they're very simple to set up

Here's some more information about each of the fields you need to fill in:

Code: The code you want to be included inside the overlay. Although it is HTML that will be shown, you can also include Style tags, or Script tags that will also be run when the overlay shows.

Opacity: How transparent you want the background behind the overlay to be.

Transition Speed: The time you want it to take for the overlay to fade in and out.

Target this reaction to: The segment you want to see this reaction.

On Entry / On Exit / Every Time: When you want the overlay to be displayed. On entry to a segment, when a user exits a segment, or every time they visit a page while in that segment.

Variants: Covered in Reporting below.

Context Criteria: Explained below

Reporting

When using Marketing Overlays, you can track impressions and conversions on the overlays. Conversions mean clicks on the overlay.

Conversions are tracked automatically when using the Image overlay. If you're using HTML you'll need to add a custom JavaScript tracking of conversion() when the overlay is clicked. Get in touch if you'd like help setting this up.

Variants

If you want to test an overlay to different audiences, or different overlay content you can set up multiple variants. These variants will be tracked in Permutive.

You can set up a variant by clicking '+ Add Variant' then setting up your variant in the same way as you set up your initial overlay.

Variants are tracked in the A/B testing, and the dashboard will display conversion rates for each variant.

Above is an example of an overlay A/B/C test, with results.

Context Criteria

Context criteria is a way of limiting who sees an overlay based on their current context. This could be their location, referrer, IP address or anything. You can set context variables in JavaScript, then reference them in your overlays. This usually requires a developer, so it's best to get in touch with us first to guide you through the process.

Did this answer your question?