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.

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.

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".

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.

Step 3: Edit Cookie Consent Popup

• Select Bottom Bar Type templates

• Modify button text, such as changing the button text to "Accept & Close".

• 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.

• Increase button size, set the font in the style,background color(you can use color palettes or Hex codes).

• Copy button and set the other one to "Decline"Options:
  • Change color
  • Adjusting font size
  • Add underline style for visual contrast

Step 4: Optimize the overall style of the pop-up window

• text leftThe buttons are right or evenly distributed

• 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.

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

• Triggers::
  • set to Display immediately after page load (Page Load)
  • Just turn on the slider

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.

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

Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!	Customer Service
① Tel: 020-2206-9892
② QQ咨询：1025174874
(iii) E-mail: [email protected]
④ Working hours: Monday to Friday, 9:30-18:30, holidays off