GDPR Cookie Consent with JavaScript / jQuery

Today, we are going to share a lightweight and easy to install jQuery plugin to create GDPR cookie consent message popup based on JavaScript cookies. It helps you to create highly customizable GDPR / EU cookie agreement popup on the top / bottom (or fixed bottom left/right) of the webpage. It displays to the new users only if they accept your site’s cookies policy then this cookie consent message will not show.

Moreover, the plugin comes with three built-in color scheme (dark, white and compact). It can be fully customize with additional CSS according to your needs.

Plugin Overview

Plugin: EU Cookie Law Popup
Author: Richard Dancsi
Licence: MIT Licence
Published: September 29, 2019
Repository: Fork on GitHub
Dependencies: jQuery 1.3.1 or Latest version
File Type: zip archive (HTML, CSS & JavaScript )
Package Size: 12 KB

How to Use GDPR Cookie Consent Plugin

1. First of all download this project and include EU cookie law plugin’s CSS and JavaScript file (just after jQuery) into your website.

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

<!-- Cookie Consent CSS -->
<link rel="stylesheet" type="text/css" href="css/jquery-eu-cookie-law-popup.css"/>

<!-- Cookie Consent JS -->
<script src="js/jquery-eu-cookie-law-popup.js"></script>

2. After loading necessary assets, create a div element (in which cookie consent message will be created) and place it in starting of body tag.

<body>
   <div class="eupopup eupopup-top"></div>

<!-- You other contents -->

</body>

3. The plugin will automatically initialized / activated. However, if you want to customize plugin’s through configuration options, use the following JavaScript syntax to create custom GDPR cookie consent.

$(document).ready( function() {
	if ($(".eupopup").length > 0) {
		$(document).euCookieLawPopup().init({
			'info' : 'YOU_CAN_ADD_MORE_SETTINGS_HERE',
			'popupTitle' : 'This website is using cookies. ',
			'popupText' : 'We use them to give you the best experience. If you continue using our website, we\'ll assume that you are happy to receive all cookies on this website.'
		});
	}
});