Multi-language Cookie Notice Bar Plugin - cookieBar

Multi-language Cookie Notice Bar Plugin - cookieBar

Just another jQuery based cookie notice plugin that makes your website & blog comply with the European cookie law and GDPR (General Data Protection Regulation).

The plugin makes it easier to create a multi-language, customizable cookie consent message that informs visitors your site uses cookies.

The cookie notice bar is dismissable and saves the user selection in the cookies.

1. Load the main stylesheet jquery.cookieBar.min.css in the header of the document.

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

2. Load jQuery library and the main JavaScript jquery.cookieBar.min.js at the end of the document.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="jquery.cookieBar.min.js"></script>

3. Create a default cookie notice bar that will be stay on the top of the webpage.

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

4. Change the position of the cookie notice bar. Available position values: 'top', 'bottom', 'bottom-left', and 'bottom-right'.

$(function() {
  $.cookieBar({
    style: 'top'
  });
});

5. Don't forget to replace the URL of your Privacy Policy page.

$(function() {
  $.cookieBar({
    infoLink:   'https://www.jqueryscript.net/privacy/',
    infoTarget: '_blank'
  });
});

6. Customize the Cookies Expiration Date (Default: 365 days)

$(function() {
  $.cookieBar({
    expireDays: 365
  });
});

7. Specify where the cookie notice bar should be appended to.

$(function() {
  $.cookieBar({
    wrapper: 'body'
  });
});

8. Change the lauange of the cookie consent message. Supported language: 'en', 'de', 'cs', 'sk'.

$(function() {
  $.cookieBar({
    language: 'en'
  });
});

9. Add your own language strings just like this:

translation['en'] = {
  message:  'We use cookies to provide our services. By using this website, you agree to this.',
  acceptText: 'OK',
  infoText: 'More information'
};
translation['de'] = {
  message:  'Zur Bereitstellung von Diensten verwenden wir Cookies. Durch die Nutzung dieser Website stimmen Sie zu.',
  acceptText: 'OK',
  infoText: 'Mehr Informationen'
};
translation['cs'] = {
  message:  'K poskytování služeb využíváme soubory cookie. Používáním tohoto webu s&nbsp;tím souhlasíte.',
  acceptText: 'V pořádku',
  infoText: 'Více informací'
};
translation['sk'] = {
  message:  'Na poskytovanie služieb využívame súbory cookie. Používaním tohto webu s&nbsp;tým súhlasíte.',
  acceptText: 'V poriadku',
  infoText: 'Viac informácií'
};

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

  • Publication date: 19.05.2018
  • Source