As of May 25th, 2018, the European Union’s GDPR law is officially in effect. If you fall under its jurisdiction, that means you need to start notifying visitors that you use cookies, among a number of other important changes.
The best way to do that is with a cookie consent popup. And if you’re not sure how to create such a popup, that’s what this post is all about!
We’re going to show you exactly how to create a GDPR cookie consent popup on WordPress using the free Popups plugin. Here’s an example that we built with this plugin:
There’s no code required and you can be up and running in just a few minutes!
To get started, all you need to do is install and activate the free Popups plugin at your site. Then, here’s how to do everything else…
Step 1: Create New Popup And Choose Position
To create your cookie consent popup, go to Popups → Add New in your WordPress dashboard.
In the Add New Popups interface, scroll down to the Display Options and choose Bottom Bar from the Box Position drop-down:
This ensures that your cookie consent popup displays at the bottom of the page, rather than in the center of a user’s screen like you’d want with an email opt-in popup.
By default, the cookie consent popup will display 5 seconds after a user lands on the page. But if you want to change the timing, you can do that in the Trigger section that’s immediately below the Position section:
Step 2: Add Cookie Consent Message
Now, you can scroll up to the top of the page and add your cookie consent text to the popup preview:
You can use whatever text you (or your lawyer!) prefer, but here’s a rough template to get you started:
We use cookies to offer you a better browsing experience, analyze site traffic, personalize content, and serve targeted advertisements. Read about how we use cookies and how you can control them by clicking “Privacy Preferences”. If you continue to use this site, you consent to our use of cookies.
You can use the regular WordPress editor buttons to insert a link to your privacy policy or privacy preferences pages, if needed.
Step 3: Add Conversion Cookie To Consent Button
The idea of a cookie consent popup is that a user clicks I agree once, and then they don’t see the cookie consent popup again. Makes sense, right? It would be annoying if they had to agree on every single visit.
To control this, you can create an I agree button that adds a cookie that will both close the popup and stop the cookie consent popup from showing to that specific user for a certain amount of time.
The Popups plugin includes a built-in shortcode that lets you easily add such functionality.
To add this button to your popup, all you need to do is use this shortcode:
[[spu-close conversion="true" class="btn-primary" text="I agree"]]
To adjust the position of your button, you can use the normal WordPress editor alignment options.
Step 4: Configure The Close Button
If a user clicks the I Agree button, they won’t see the cookie popup again. But they can also click the X icon to close the popup without agreeing.
To make sure that they continue to see the cookie consent popup until they agree, you can edit the Closing cookie duration in the Cookies section. If you make it zero, your visitors will see the cookie consent popup on every page load until they hit the “I Agree” button:
Or, if you’d prefer to just not allow visitors to close the popup unless they agree, you can purchase the premium version of Popups to get that functionality.
Step 5: Style Your Cookie Consent Popup To Match Your Site
At this point, you have all the functionality necessary for a working cookie consent popup. Now, all that’s left to do is style your popup so that it matches your site.
To do that, you can use the PopUp Appearance section:
Most of these settings are fairly self-explanatory and, as you make changes, you’ll see them reflected on the preview of your cookie consent notice at the top of the page.
Additionally, the Popups program will try to pull styles from your active theme. So you won’t necessarily need to configure every little detail to get a cohesive design.
Step 6: Publish Your Popup To Make It Live
Once you finish styling your cookie consent popup, all you need to do is click the normal WordPress Publish button to make it live:
And that’s all you need to create a cookie consent popup on WordPress. Your users should now start seeing your popup when they visit:
To create your own cookie consent popup on WordPress, head to WordPress.org and download the free Popups plugin.
Leave a Reply