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
- 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.)
- 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
- Don’t Show Again: Yes
- Size: Medium
Button > Style
- Color: Choose a color
- Padding: Remove all padding
Right-click the Button widget’s handle, and select Duplicate. Now style this Button.
Button > Content
- Text: Enter “Decline”
- Link: Enter a link to a Terms of Use page that explains why cookies are needed.
- Size: Medium
Button > Style
- Background Color: Clear
- Border Type: Solid
- Border Width: 1 for Bottom only
- Border Radius: 0 for all corners
- 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
- Prevent Closing on Overlay: Yes
- 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
- Include: Entire Site
- 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.