Customizable EU Cookie Notice Popup Plugin - jQuery CookiePopup.js

CookiePopup.js is a simple, responsive cookie acceptance jQuery plugin that allows your web app to comply with EU cookie law, in a non-obtrusive way that conforms to your site's style.

Features:

• Easy to Use
• Customizable: Many different themes and options available.
• Responsive: Scales to fit your device automatically. No extra work needed!

How to use it:

1. Include the style sheet accept-cookies.css in the page's header section.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="cookiepopup.js"></script>

2. Include the JavaScript file cookiepopup.js after jQuery library:

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="cookiepopup.js"></script>

3. Add the $.acceptCookies() function to the webpage and done.

$(function () {
  $.acceptCookies();
}

4. Customize the cookie popup with the following options.

$.acceptCookies({

  // popup title
  title: "This website uses cookies",

  // notification text
  text: "By using this site, you agree to our use of cookies.",

  // Light, Dark, Red, Pink, Purple
  // Deep, Purple, Indigo, Blue, Light Blue
  // Cyan, Teal, Green, Light Green, Lime
  // Yellow, Amber, Orange, Deep, Orange
  // Brown, Grey, Blue Grey
  theme: "light",

  // shows learn more link
  learnMore: true,

  // Top, Top Left, Top Right
  // Bottom, Bottom Left, Bottom Right
  position: "bottom",

  // callback
  onAccept: function(){}
  
});

5. Customize the expiry date in the saveCookie() function.

function saveCookie() {        
  var expires = "expires=01/01/2099"
  document.cookie = "cookiesAccepted=true; " + expires + "; path=/";
}

Change log:

2017-09-20

• Refactored cookie plugin options.
• CSS update

---

This awesome jQuery plugin is developed by mjk90. For more Advanced Usages, please check the demo page or visit the official website.