Page tree
Skip to end of metadata
Go to start of metadata

Flicker occurs when the original site content is shown briefly before it is personalized. You can prevent flicker using Interaction Studio's Zero Flicker feature to hide the personalized sections of the page briefly during page load. Zero Flicker is designed to work with inline messages and in-page edits since the changes are adding additional content or replacing content that already exists on the page.

Interaction Studio Classic Only

Please note, the contents of this article are intended for customers using Interaction Studio (formerly Evergage Classic). Do not adjust your beacon version to downgrade or upgrade.

This Article Explains

This article details how to prevent flicker using the Zero Flicker feature.

Sections in this Article

Configure Dataset Settings

  1. Log into Interaction Studio as an administrator
  2. In Channels & Campaigns, select Web > JavaScript Integration
  3. Confirm that the Interaction Studio JavaScript beacon is integrated Synchronously on your site
  4. Select Settings > General Setup > Advanced Options
  5. Select Zero Flicker options:
    1. Reduce Flicker by Hiding Page Sections 
    2. Prevent Original Pages from Showing During Redirects
  6. Enter the Redisplay Timeout which is the number of milliseconds Interaction Studio will hide the personalized content area while the page loads. The recommended time parameter is 2000 ms


Configure Inline Message Settings

Once you have Zero Flicker enabled for your dataset, you'll need to enable it at the message level for any inline message or in-page edit you want to eliminate flicker on. Once you do this, Interaction Studio will hide the content your message will replace which will result in a smoother experience, since visitors won't see one piece of content being replaced by another as Interaction Studio will wait until the page loads to show that section of content.

  1. Create or edit a campaign
  2. Create or edit an inline message (Zero Flicker only works with inline messages)
  3. Click 
  4. On the Type tab, select Hide message target while page is loading
  5. The Selector field will change from jQuery to CSS

    NOTE

    All inline messages and in-page edits must use a CSS selector to target the content being replaced

Configure the Campaign

There are several requirements at the campaign level that must be met to use Zero Flicker:

  • The campaign status must be set to Testing and cannot be in the Disabled state even though some testing modes will show a Disabled campaign
  • Zero Flicker only works for full page reloads. Single-page sites or partial page loads cannot benefit from Zero Flicker