showcase Cookies Consent pop-ups Not only does it help to enhance the user experience, but it's also an important part of complying with privacy laws such as GDPR. The use of Elementor Pro Popup Builder, which makes it easy to create beautiful and functional Cookie ReminderThis article will take you step-by-step through the process of creating a typical cookie consent popup and introduce you to the various styles Elementor offers. In this article, we will take you step by step to create a typical Cookie Consent popup, and introduce the various popup styles provided by Elementor.
Why create a Cookie Consent Popup?
The main purpose of creating a cookie consent pop-up is toCompliance with increasingly stringent global data privacy regulationsThese laws, such as the EU's GDPR and California's CCPA, require websites to use cookies to track user behavior and collect data. These laws require that before a website can use cookies to track user behavior and collect data, it mustObtaining the express consent of the userBy setting up a cookie pop-up window that is clearly visible By setting up clearly visible cookie pop-ups, websites can not only operate legally and in compliance, but also enhance user trust and give visitors a clear understanding of how their data is being used. This is not only a legal responsibility, but also a way for websites to respect and protect the privacy of their users.
![Image[2] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408183624672-image.png)
procedure
Step 1: Open the popup builder and name it
Using shortcuts Command + E(or on Windows) Ctrl + E), open the Finder ToolbarThen select Create New Popup. In the pop-up screen, give your pop-up a name, such as "Cookie Consent".
![Image [3] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408164837768-image.png)
Step 2: Understanding pop-up template types
Elementor provides a variety of preset popup styles. Clicking on the "Categories" drop-down menu will show you the following commonly used types of popups:
- Classic: The most common center floating window, suitable for subscription forms and promotional pop-ups.
- Fly-In: Fly in from the edge of the screen to draw the user's attention.
- Full Screen: Perfect for highlighting a particular CTA or limited time event.
- Hello Bar (top horizontal bar): Mainly used for notifications, discount information, etc.
- Slide-In (Side Slide-In): Takes up a portion of the screen and is suitable for product recommendations or questionnaires.
- Bottom Bar: Suitable for cookie banners.
![Image [4] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408164933427-image.png)
Step 3: Edit Cookie Consent Popup
- Select Bottom Bar Type templates
![Image [5] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408165743407-image.png)
- Modify button text, such as changing the button text to "Accept & Close".
![Image [6] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408165846580-image.png)
- start using "No longer displayed when clicked" function (Don't Show Again), which allows the user to click Agree and then not show it again.
![Image [7] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408170026201-image.png)
- Increase button size, set the font in the style,background color(you can use color palettes or Hex codes).
![Image [8] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408170619601-image.png)
- Copy button and set the other one to "Decline"Options:
- Change color
- Adjusting font size
- Add underline style for visual contrast
![Image [9] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408170542349-image.png)
Step 4: Optimize the overall style of the pop-up window
- text leftThe buttons are right or evenly distributed
![Image [10] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408171105521-image.png)
- Click on the bottom left corner Setting the gear icon Go to popup settings
- Closing the Overlay
- In "Advanced" set to Clicking on the background and the ESC key does not close the pop-up window.
![Image [11] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408181506317-image.png)
Step 5: Setting Display Conditions and Trigger Methods
- Conditions: Set which pages the popup is displayed on
- Example: Displayed site-wide, theExcluding the "User agreement" page
![Image [12] - Don't want to break the rules or get in trouble? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408181640568-image.png)
- Triggers::
- set to Display immediately after page load (Page Load)
- Just turn on the slider
![Image [13] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408181618335-image.png)
Step 6: Preview the effect and test the interaction
Open the frontend of the site and you can immediately see the cookie popup you made. Click on the "acceptance"or"rejection", observe whether the pop-up window hides or stays displayed as expected, and confirm that the logic is correct.
![Image [14] - Don't want to break the rules and don't want the hassle? Here's how to get rid of cookie reminders with Elementor popups.](https://www.361sale.com/wp-content/uploads/2025/04/20250408182048955-4月8日.gif)
summarize
With Elementor Pro's popup builder, creating GDPR and CCPA compliant cookie consent popups is incredibly easy. Whether you want to display a reminder bar at the bottom of the page or choose a more attractive popup style, Elementor offers flexible and powerful design capabilities.
For more WordPress related tutorials and information, follow thePhoton fluctuation network, has the most comprehensive WordPress tutorials and the most activeWordPress Exchange CommunityThe
Link to this article:https://www.361sale.com/en/49377The article is copyrighted and must be reproduced with attribution.
![Emoji[wozuimei]-Photonflux.com | Professional WordPress repair service, worldwide, rapid response](https://www.361sale.com/wp-content/themes/zibll/img/smilies/wozuimei.gif)
![Emoticon[baoquan] - Photon Wave Network | Professional WordPress Repair Services, Worldwide Coverage, Rapid Response](https://www.361sale.com/wp-content/themes/zibll/img/smilies/baoquan.gif)
简体中文 
English 
日本語 
Français 
Español 
No comments