Sticky Cookie Accept Banner In jQuery - cookit.js

File Size: 93.3 KB
Views Total: 5279
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Sticky Cookie Accept Banner In jQuery - cookit.js

Just another JavaScript solution to make your site comply with the EU cookie law.

cookit.js is a tiny yet configurable jQuery cookie consent plugin to create a sticky bottom cookie bar that informs your users about the use of cookies on your website and asks them to agree to accept cookies.

The plugin displays the cookie consent banner on the user's first visit and remembers the user's choice for 365 days.

See Also:

How to use it:

1. Add jQuery library and the cookit.js plugin's files to your website.

<link rel="stylesheet" href="/path/to/cookit.css" />
<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/cookit.js"></script>

2. Initialize the plugin to generate a default cookie consent banner at the bottom of the webpage.

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

3. Customize the cookie consent messages.

$.cookit({
  messageText: "<b>Do you hungry ?</b> Pursuing navigation on this site, you accept the use of cookies.",
  linkText: "Learn more",
  linkUrl: "/privacy/",
  buttonText: "I accept"
});

4. Customize the appearance of the cookie consent banner.

$.cookit({
  backgroundColor: '#1c1c1c',
  messageColor: '#fff',
  linkColor: '#fad04c',
  buttonColor: '#fad04c',
  buttonTextColor:'#00000',
});

5. Set the the maximum lifetime of the cookie. Default: 365.

$.cookit({
  lifetime: 365,
});

Changelog:

2022-05-24

  • Added ability to customize button text color

2021-05-04

  • Add preventDefault() on "accept" button

2021-05-02


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