Display Formats

Overview

Display formats show your own HTML on your pages in a chosen layout. There are five:

• Page Takeover: your content fills the whole screen.
• Modal Box: a centred box over a dimmed page.
• Sidebar: a bar fixed to the top, bottom, left or right of the screen.
• Content Wall: the article stops after the first paragraphs and your message asks the reader to sign up or log in.
• Div Insertion: your content is placed in, before or after an element on your page.

Choose a format

Set up a display format

1. Go to Audience Operation → Experience and click New Experience.
2. In Choose Experience Type, pick Page Takeover, Modal Box, Sidebar, Content Wall or Div Insertion, then click Next Step.
3. Enter a Name, choose the Project and turn on Enable.
4. Fill in the settings for the format, see below. Write your HTML in Content. The preview next to the editor updates as you type.
5. Click Save Changes.

Page Takeover

• Content: the HTML shown full screen.

Modal Box

• Can be closed: Yes shows a close icon in the top right corner of the box.
• Text color and Background color of the box.
• Close button color: the colour of the close icon.
• Content: the HTML inside the box.

Sidebar

• Position: Top, Right, Bottom or Left. Top and bottom bars span the width of the screen, left and right bars span its height.
• Text color and Background color of the bar.
• Content: the HTML inside the bar.

Content Wall

• Selector: the CSS selector of your article body.
• Skip paragraphs: how far into the article the wall appears. Everything after it is hidden.
• Can be closed: Yes adds a Skip button so readers can continue without an account.
• Content: the message shown in the wall, over a blurred preview of text.

Readers who are signed in do not see the wall, and the article unlocks as soon as a reader signs in.

Put {{unisignin-button}} in Content to show the Sign Up and Login buttons, plus Skip when the wall can be closed.

Div Insertion

• CSS Selector: the element to use. Every element that matches is used.
• Type:
  • Insert into: hides what is inside the element and shows your content instead.
  • Insert after: adds your content right after the element.
  • Insert before: adds your content right before the element.
• Content: the HTML to insert.

Put it live

Display formats are shown through Orchestration. Add the experience to an Orchestration to choose the pages, context and readers it shows to, and to A/B test variants. See Orchestration.

Add sign-up and unlock actions

Use placeholders in Content to add a tracked sign-up link, or a link that unlocks a Content Wall. See Placeholders.