Logic Bars

Overview

Logic Bars are dynamic, personalized banners that can be added to your site in minutes. Use the default conditions, or craft your own custom conditions to decide which visitors see a bar and when.

Creating a Logic Bar

Create a Logic Bar from the Logic Hop menu in your WordPress dashboard, then choose the condition that controls its display and add your content. A short video walkthrough is available on the Logic Hop site.

Logic Bar settings

Each Logic Bar exposes a full set of display and styling controls so you can match it to your brand and target the right moment in the visit.

• Condition and Condition Option — choose the condition and whether the bar shows when it is met or not met
• Logic Bar Content — the HTML displayed inside the bar, with a Tool Palette button to insert Data Variables
• Colors — background, font, link, and button colors set by HEX code (button color applies to elements with the logic-bar-btn class)
• Sticky Header — keep the bar pinned to the top or let it scroll with the page
• Drop Shadow — toggle a shadow beneath the bar
• Display Option — show immediately, on scroll, on click, on exit intent, or after a set number of seconds
• Display Type — render as a horizontal header bar or as a pop up over the page

Data Logic Tags in Logic Bars

Logic Bar content supports Data Logic Tags, so you can personalize the message with live visitor data such as city or campaign. Use the Add Data Variable button to open the Tool Palette and insert a tag.

Dismiss CSS class

Add the Logic Bar dismiss CSS class to any element inside the bar content to let visitors close the bar. Clicking that element hides the Logic Bar for the visitor.