Lesson 1 of 0
In Progress

Creating a Cookie Consent Popup

Jared Lutz December 14, 2020

Create a cookie consent bottom bar.

You’ll learn how to:

  • Edit a pre-designed popup template
  • Close a popup on button click
  • Set multiple conditions for controlling where a popup is displayed
YouTube player

Design The Popup And Its Content

  1. Go to Templates > Popups > Add New and give your new Popup a name. (An alternative method is to press CMD+E or CTRL+E to open Finder, search for Popup, choose Add New Popup, and give it a name.)
  2. Choose a pre-designed Popup template or close the Library overlay and design your Popup from scratch. For this example, choose one of the Cookie Consent bottom bars.

Button > Content

Text: Enter “Accept & Close”.

Link > Popup
  1. Don’t Show Again: Yes
  2. Size: Medium

Button > Style

  1. Color: Choose a color
  2. Padding: Remove all padding

Right-click the Button widget’s handle, and select Duplicate. Now style this Button.

Button > Content

  1. Text: Enter “Decline”
  2. Link: Enter a link to a Terms of Use page that explains why cookies are needed.
  3. Size: Medium

Button > Style

  1. Background Color: Clear
  2. Border Type: Solid
  3. Border Width: 1 for Bottom only
  4. Border Radius: 0 for all corners
  5. Padding: 5 for Bottom only

Edit the text

Heading > Content

Alignment: Left.

Edit the Accept & Close button

Button > Content

Alignment: Justified.

Drag the text column so it is taking up a wider portion of the bar, and drag the Accept button column so it takes up less space. Adjust as desired.

Click the cog / gear icon  located at the bottom left of the panel to return to the Popup Settings.

Popup Settings > Settings

Overlay: Hide.

Popup Settings > Style

Color: Adjust the color as needed.

Popup Settings > Advanced

  1. Prevent Closing on Overlay: Yes
  2. Prevent Closing on ESC: Yes

Publish The Popup

Click the Publish button to set the ConditionsTriggers, and Advanced Rules.


Click on Add Condition

  1. Include: Entire Site
  2. ExcludeSinglular > All Pages > Terms of Use page


On Page Load: Yes at 0 seconds.

Click Save and Close button

All done. Go to your site and see it in action.