How do I create a cookie consent popup?

Cookies are small pieces of data many websites store on visitors’ computers to keep track of things like their login information. Many jurisdictions require websites receive visitors’ consent to have cookies stored on their computers. This is usually done with a a popup menu.

Let’s learn how to create a cookie consent popup along the 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

---

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 Conditions, Triggers, and Advanced Rules.

Conditions

Click on Add Condition

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

Triggers

On Page Load: Yes at 0 seconds.

Click Save and Close button

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

Note: This method is not GDPR compliant, as it does not store acceptance or block cookie scripts before consent. If you need to be GDPR compliant, please use a cookie consent plugin that is GDPR compliant instead.