EU Cookies Bar


Created: 25/06/2018
Latest update: 1/2025 – Updated version: 1.0.0

By: VillaTheme

Thank you for purchasing our plugin. If you have any questions that are beyond the scope of this documentation, please feel free to request support at our Support Forum. Thanks so much!

WordPress EU Cookies Bar is a user-friendly WordPress plugin designed to help you easily comply with the EU Cookie Law.

Cookies are small files of data that websites store on your device. When you visit a website, it sends these cookies to your web browser. Your browser then saves these cookies for a specific time or for your current browsing session.

Whenever you visit that website again, your browser sends the saved cookies back to the website. This allows the website to remember you and personalize your experience. For example, online stores use cookies to keep track of the items you’ve added to your shopping cart.

Some cookies are essential for security, such as those used to keep you logged in to a website.

The EU Cookie Law (part of the ePrivacy Directive) requires websites to obtain explicit consent from users before storing or accessing cookies on their devices. This law aims to protect user privacy and ensure transparency about how websites use cookies.

What is GDPR?

The General Data Protection Regulation (GDPR) (EU) 2016/679 is a regulation in EU law on data protection and privacy for all individuals within the European Union (EU) and the European Economic Area (EEA). It also addresses the export of personal data outside the EU and EEA areas. The GDPR aims primarily to give control to citizens and residents over their personal data and to simplify the regulatory environment for international business by unifying the regulation within the EU.

*By activating EU Cookies Bar does not guarantee your sites fully comply with GDPR

An EU Cookie Bar plugin is a WordPress tool that helps website owners comply with the EU Cookie Law. These plugins typically include features like Cookie Banner (A prominent message that informs visitors about the use of cookies on the website and obtains their consent); Cookie Settings (Options for users to customize their cookie preferences), Cookie Policy Page (A dedicated page that provides detailed information about the cookies used on the website)…

WordPress EU Cookies Bar: The Easy Way to Comply

With its intuitive interface and powerful features, you can quickly and easily:

  • Streamlined Compliance: Automatically detect user language and region to display tailored cookie notices.
  • Enhanced User Experience: Customize cookie bar design and content to align with your website’s branding.
  • Complete Control: Manage cookie behavior and consent actions effortlessly.
  • Integrated Tracking: Support for advanced tools like Google Tag Manager (GTM) and Meta Pixel.

 Key features: 

  • Multilingual Support: Add language and assign countries. Automatically detect user language based on their IP address and display the cookie banner in their preferred language.
  • Flexible Consent Options: Allow users to “Accept All,” “Reject All,” or customize their consent preferences.
  • Detailed Control: Define actions upon closing the banner, refreshing/navigating to another page, or mouse scrolling (e.g., close, do nothing, reject, accept).
  • “Block Until Accept” Feature: Ensure no cookies are set before user consent is obtained.
  • “Always Active” Categories: Define essential cookie categories that are always active, ensuring website functionality.
  • Precise Time Settings: Define how many days the acceptance of cookies remains valid, or the duration for rejecting cookies before asking again.
  • Google Tag Manager (GTM) Integration
    • Customizable GTM variables and event prefixes to better organize and track cookie-related events within your GTM setup.
    • Automatically add GTM script directly to your website.
  • Meta Pixel Integration
    • Automated Pixel Scripting: Automatically add Meta Pixel scripts to your website for hassle-free tracking.
    • Customizable Pixel Tracking: Define your own Pixel Dataset ID and customize variable names to match your tracking needs.
  • Organized Cookie Categories: Create and manage cookie categories with ease, including names, descriptions, and individual cookie listings.
  • Detailed Cookie Information: Define individual cookies within each category with names, durations, and descriptions.
  • Highly Customizable Design: Customize the appearance of the cookie bar, settings popup, and floating icon to match your website’s style.
  • Full Content Control: Control the text and appearance of all elements within the cookie bar and settings popup.
  • Comprehensive Cookie List: Maintain a clear and organized list of all cookies used on your website. Add or remove, and scan cookies manually as you need.
  • Reports: Gain insights into your website’s cookie consent performance through customizable reports.  View overall consent statistics or per cookie category
  • Activity Logs: Keep a detailed record of user interactions with the cookie consent mechanism, including IP address of the user, accepted/rejected categories, detected language and date.

Required:

  1. WordPress 6.0+
  2. PHP 7.0+

Install Plugin:

Follow this guide to install plugin.

  • If you’re using the free version, search for the plugin named EU Cookie Bar in the WordPress plugin directory.
  • If you’re using the pro version, ensure the zip file you upload is named eu-cookies-bar-for-wordpress.zip.

Done! Let’s start using the plugin.

After having the plugin installed and activated, you’re ready to configure it for your website. Below you can have an overview of the key actions you can take to set up and optimize the plugin:

Define Cookie Categories

  • Go to the Cookie Categories section.
  • Create categories as per your needs. E.g. Necessary, Analytics, Performance, Advertisement, etc.
  • Provide a name, description, and assign cookies to each category.
  • After you have list of cookies, specifying them here would be more convenient.
  • Specify if a category should always remain active on the front end (e.g., Necessary cookies) under General setting if needed.

Scan Cookies Manually

  • Navigate to the plugin dashboard and locate the cookie scanning tool.
  • Scan your website to identify cookies being used.
  • Review the detected cookies and categorize them based on their purpose (e.g., Necessary, Analytics, Performance).

Set Up General Settings

  • Access the General Settings tab in the plugin.
  • Configure core options such as:
    • Consent expiry duration for accepted/rejected cookies.
    • Actions on close, mouse scroll, or page refresh/navigation.
    • Enable or disable “Block Until Accept” based on your compliance strategy.
    • If you decide to use Detect Language feature, add multiple languages and assign them to relevant countries for language detection.

Customize/Design the Cookie Bar and Settings Popup

  • Open the Design Settings tab.
  • Personalize the cookie bar’s appearance:
  • Adjust colors, fonts, and button styles (e.g., Accept, Reject, Settings, Privacy).
  • Customize the Settings Popup, including its layout and button designs.
  • Add a floating icon to improve accessibility and user interaction.
  • Preview to ensure the content is accurate and aligns with your compliance requirements.

Configure Cookie Bar Content for Each Language

For each language set up in General Settings, configure:

  • Cookie bar content: Text for headings, messages, and buttons.
  • Settings popup content: Descriptions and cookie category details.

 

Take a look at our live demo and test the cookie bar, interact with it as a visitor would: https://new2new.com/?item=wordpress-eu-cookies-bar

And watch this tutorial video for details

How does it work


Settings – General

Options to control the general behavior and functionality of your cookie bar

  1. Enable: Toggle this option to activate or deactivate the cookie bar on your site.
  2. Detect language: Automatically detects the visitor’s language based on their location and displays the cookie bar in that language, based on the settings in Language table.
  3. Geolocate API: Allows you to choose how the user’s geographical location is detected for language detection or cookie consent settings.
    • Inherited from Server
    • Geoplugin API
  4. Language: Set the default language for the cookie bar when language detection is disabled or unavailable. First language is the default language.
  5. Accept expire (days): Specify the number of days the cookie consent remains valid after a user accepts.
  6. Reject expire (days): Specify the number of days the cookie rejection remains valid after a user rejects.
  7. Action on close: Define what happens when a user closes the cookie bar without explicitly accepting or rejecting
    • Just close
    • Accept cookies
    • Reject cookies
  8. Action on mouse scroll: Set the behavior when a user scrolls on the page (e.g., treat scrolling as implicit acceptance of cookies).
    • Do nothing
    • Accept cookies
    • Reject cookies
  9. Action on refresh/go to other page: Decide how the plugin handles page refreshes or navigation if the user hasn’t provided cookie consent
  10. Block until accept: Block all cookies (except strictly necessary cookies) until the visitor accepts to use. Strictly necessary cookies are ones within the categories selected in option 11 below.
  11. Always active: Keeps the cookies in this category active by default on front end.
  12. Enable Google Tag Manager (GTM): Activate integration with Google Tag Manager to manage cookies and tracking consent efficiently
  13. Add GTM script: Automatically add the Google Tag Manager script to your website if it hasn’t been implemented already
  14. GTM code: Enter your unique Google Tag Manager container ID (e.g., GTM-XXXXXX) to integrate with your site
  15. GTM variable name: Keep the default value or specify the name of the variable used within GTM to handle cookie consent events
  16. GTM event prefix: The event prefix is optional and customizable in your plugin (e.g., cookie_ for events like cookie_accept or cookie_reject). You don’t need to specifically define this, keeping the default value would be fine.
  17. Enable Meta Pixel: Enable integration with Meta Pixel (formerly Facebook Pixel) for tracking visitor behavior and cookie consent. Meta Pixel detects site cookie data using the Pixel Dataset ID and transfers the data to a designated variable for tracking and analysis
  18. Add Pixel script: Automatically insert the Meta Pixel tracking script into your website if it hasn’t been added yet
  19. Pixel Dataset ID: Enter the unique identifier for your Meta Pixel dataset to link it with your website
  20. Pixel variable name: Define the variable name used for tracking Meta Pixel-related consent and events
  21. Custom CSS: Add your custom CSS code to style the cookie bar, ensuring it matches your site’s branding.

 

 

Settings – Cookie Category

Cookie categories are used to group cookies based on their purpose and function.

  1. Add Category: Add a new cookie category
  2. Expand All/Collapse All:
    • By default, the categories are closed, you open each of them by clicking the category. Use this button to open them all at once.
    • Once clicked, the button becomes “Collapse All” to close all categories at once.
  3. Cookie category settings:
    • Drag and drop the category to adjust their position on front end.
    • Name: Enter the cookie category name in all the language(s) you set up under General setting tab.
    • Description: Enter the cookie category description in all the language(s) you set up under General setting tab.
    • Cookie list: See the list of cookies for that specific category. Add, remove particular cookie, or remove all.
  4. Remove: Remove the selected cookie category.

 

Design

Allows you to tailor the visual appearance of the cookie bar and settings popup, and related elements to match your website’s branding

  1. Preview: Tick the checkbox to see a live preview of your current cookie bar configurations
  2. General
    • Enable cookie bar: Toggle to enable or disable the cookie bar on your website
    • Position: Choose the desired position for the cookie bar
      • Top left
      • Top
      • Top right
      • Bottom left
      • Bottom
      • Bottom right
    • Display delay (second): Set the number of seconds to wait before displaying the cookie bar
    • Dismiss on time out: Automatically dismiss the cookie bar after a specified time
    • Timeout (seconds): Set the time out as needed for the “Dismiss on time out” option
    • Conditional tag: Define specific conditions (e.g., pages, posts) where the cookie bar should appear.
  3. Cookie bar content
    • Opacity: Adjust the transparency of the cookie bar content
    • Background color: Set the background color of the cookie bar
    • Accept button: This button allows users to accept all cookies used on the website with a single click
      • Enable: Toggle to enable/disable the “Accept” button
      • Color: Set the text color of the “Accept” button.
      • Background color: Set the background color of the “Accept” button.
      • Border color: Set the border color of the “Accept” button
    • Reject button: This button allows users to reject all non-essential cookies. Essential cookies, which are selected in “Always active” option under General setting tab, may still be set even if “Reject All” is selected.
      • Enable: Toggle to enable/disable the “Reject” button.
      • Color: Set the text color of the “Reject” button.
      • Background color: Set the background color of the “Reject” button.
      • Border color: Set the border color of the “Reject” button.
    • Setting button: This button opens the settings popup, providing users with more granular control over which cookies they consent to.
      • Enable: Toggle to enable/disable the “Settings” button.
      • Icon: Select an image and make it the icon for the “Settings” button.
    • Close button: This button closes the cookie bar, with the behavior (just close, accepting or rejecting any cookies) set in Action on close option under General setting tab
      • Enable: Toggle to enable/disable the “Close” button.
      • Icon: Select an icon for the “Close” button.
    • Privacy button: This button links to the website’s privacy policy, commonly where users can find detailed information about how their data is collected and used
      • Enable: Toggle to enable/disable a link to your privacy policy.
      • Color: Set the text color of the privacy policy link.
      • Background color: Set the background color of the privacy policy link.
      • Link: Enter the URL of your privacy policy page. If no custom URL is set, Privacy button will redirect to your site’s default Privacy policy page.
  4. Settings popup
    • Enable setting popup: Toggle to enable/disable the settings popup.
    • Position: Choose the desired position for the settings popup
      • Center
      • Left sidebar
      • Right sidebar
    • Layout: Select the desired layout for the settings popup
      • Category with tab
      • List of category
    • Icon: Select an icon for the settings popup.
    • Opacity (%): Adjust the opacity of the settings popup background.
    • Hide content from charactor: Option to hide content from, e.g. after 20th character
    • Enable Cookie List: Toggle to display or hide the list of cookies.
    • Show cookie description: Toggle to display or hide cookie descriptions.
    • Hide cookie categories: Toggle to hide cookie categories. This option only works if “Show cookie description” is active.
    • Accept button: This button accepts the user’s selected cookie preferences and closes the settings popup.
      • Enable: Toggle to enable/disable the “Accept” button.
      • Color: Set the text color of the “Accept” button.
      • Background color: Set the background color of the “Accept” button.
      • Border color: Set the border color of the “Accept” button.
    • Reject button: This button rejects all non-essential cookies based on the user’s selections and closes the settings popup
      • Enable: Toggle to enable/disable the “Reject” button.
      • Color: Set the text color of the “Reject” button.
      • Background Color: Set the background color of the “Reject” button.
      • Border Color: Set the border color of the “Reject” button.
    • Save button: This button saves the user’s cookie preferences for future visits to the website
      • Enable: Toggle to enable/disable the “Save” button.
      • Color: Set the text color of the “Save” button.
      • Background color: Set the background color of the “Save” button.
      • Border color: Set the border color of the “Save” button.
  5. Floating icon: Show an icon if the customer close the cookie bar without specifying their cookie references.

    • Enable: Toggle to enable/disable the floating icon.
    • Position: Choose the desired position for the floating icon
      • Top left
      • Top right
      • Bottom left
      • Bottom right
    • Icon: Select an image to be the icon for the floating icon.

 

 

Banner content

This tab allows you to customize the text of the elements on Cookie Bar and Settings popup. Provide your content in all the languages you’ve added in the Language table under the General tab settings.

  1. Cookie bar
    • Header title: This is the main heading or title displayed in the cookie bar
    • Description: This field allows you to provide a brief explanation about how the website uses cookies
    • Accept button: This is the text displayed on the Accept button
    • Reject button: This is the text displayed on the Reject button
    • Setting button:  This is the text displayed on the “Settings” button, to open the settings popup
    • Privacy button: This is the text displayed on the “Privacy Policy” button
    • Close button: This is the tooltip for the “Close” button (“Close” button always shows up as an icon)
  2. Setting popup
    • Header title: This is the title displayed at the top of the settings popup.
    • Overview tab: This is the title of the tab that provides a general overview of cookie usage.
    • Cookies list label: This is the label for the section displaying the list of cookies under each cookie category.
    • Cookie name label: This is the label for the column displaying the names of individual cookies (only for “Category with tab” layout).
    • Cookie description label: This is the label for the column displaying descriptions of individual cookies under cookie list (only for “Category with tab” layout).
    • Always active label: This label indicates cookies that are essential for website functionality and cannot be disabled.
    • Active label: This label indicates cookies that are currently active based on the user’s selections.
    • Description: Overview tab description – This field allows you to provide a general description of the cookies used on the website within the settings popup.
    • Accept button: This is the text displayed on the “Accept” button within the settings popup.
    • Reject button: This is the text displayed on the “Reject” button within the settings popup.
    • Save button: This is the text displayed on the “Save” button within the settings popup.
    • Privacy button: This is the text displayed on the “Privacy Policy” button within the settings popup (only for “Category with tab” layout)
    • Close button: This is the tooltip for the “Close” button within the settings popup.

 

 

Manage cookies

This page shows all available cookies and allows you to manage them used on your website.

  • Scan Cookies: Scan your website and detect cookies being set by various sources. Once scan completes, it should present a list of detected cookies, including their names, durations, and potential purposes
  • Add Cookie: This option allows you to manually add a cookie to the list.
    • Name: The unique identifier for the cookie.
    • Category: Assign the cookie to a specific category. Check and configure the category list under this setting page.
    • Duration: The length of time the cookie remains on the user’s device
    • Description: A brief explanation of the cookie’s purpose and how it is used. Enter your description in all the languages you’ve added in the Language table under the General tab settings.
  • Edit/Delete cookies

 

Activity Logs

This page provides a record of user interactions with your cookie consent mechanism.

  • Date: The date and time of the user interaction.
  • IP Address: The IP address of the user who interacted with the cookie bar.
  • Category accept: A list of cookie categories that the user accepted.
  • Category Reject: A list of cookie categories that the user rejected.
  • Language: The language displayed to the user in the cookie bar. If “Detect Language” option under General setting tab is disabled, the default language will be used.

 

 

Reports

Gain insights into your website’s cookie consent performance through customizable reports:

  • Generate reports for a selected time frame by specifying custom from-to dates.
  • View overall consent statistics or drill down into data per cookie category.

Extra Information


Thank you for your attention!

If you have any question, please create a topic at our FORUM, we will support within 24 hours.