Small Configurable EU Cookie Law Notice Bar Plugin - cookieBar

File Size: 9.35 KB
Views Total: 2950
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Small Configurable EU Cookie Law Notice Bar Plugin - cookieBar

Just another jQuery plugin for helping webmasters/bloggers with cookie consent that creates a small bar with a short message about the use of cookies and other forms of local storage.

How to use it:

1. Include the required cookieBar.css file to style the cookie bar.

<link rel="stylesheet" href="cookieBar.css">

2. Include jQuery library and the JavaScript file cookieBar.js at the bottom of the webpage.

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

3. Initialize the plugin on document ready to generate a default cookie bar at the top of the webpage.

$.cookieBar();

4. If you'd like to create your own cookie bar:

<div class="cookie-message">
  <p>By using this website you allow us to place cookies on your computer. They are harmless and never personally identify you.</p>
</div>
$('.cookie-message').cookieBar();

5. Override the default styles of the cookie bar whatever you like:

.cookie-message {
  position:fixed;
  top:0;left:0;right:0;
  padding:0 85px 0 20px;
  background:#fff;
  border-bottom:1px solid #ccc;
  box-shadow:0px 0px 3px #ccc;
  z-index: 99;
}

6. All default plugin parameters:

$('.cookie-message').cookieBar({

  // custom close button
  'closeButton': 'none',

  // hide the cookir bar on close
  'hideOnClose': true,

  // if the cookie transmission requires secure protocal (https)
  'secure': false,

  // the path the cookie is valid for
  'path': '/',

  // the domain the cookie operates on
  'domain': '',

  // cookie name
  'name': 'cookiebar',

  // expires after 365 days
  'expiresDays': 365
  
});

Changelog:

2019-12-06

  • Added expires and cookie name options

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