Stylish Multilingual Cookie Consent Popup In Vanilla JavaScript

Preview:

Description:

A standalone JavaScript library that displays a stylish, multilingual, customizable cookie consent popup to make your site comply with EU Cookie Law.

Click the Learn More link to display Cookie Consent Policy content in a popup window.

More Features:

• Auto language detection.
• Configurable expiration date.
• Easy to create your own styles.

How to use it:

1. Insert the JavaScript file cookieconsent.js into the HTML document.

<script src="./dist/cookieconsent.js"></script>

2. Initialize the library and display the cookie consent popup on page load.

CookieConsent.run({
  "cc_autorun" : true,
  "cc_website_name" : "CSSScript",
  "cc_website_url" : "CSSScript.com",       
  "cc_theme_css" : "./src/cookieconsent.css" // path to theme CSS
});

3. Customize the cookie consent popup with the following options.

CookieConsent.run({

  // parent contianer
  cc_container : "body", 

  // auto language detection
  cc_auto_language: false,

  // or set language here
  cc_current_lang : "en",               
  cc_default_lang : "en",

  // auto display on page load
  cc_autorun: false, 

  // delay in ms
  cc_delay: 20,

  // website name
  cc_website_name : null,   

  // website URL
  cc_website_url: null,

  // enable console log
  cc_enable_verbose: true, 
  
  // 30 days
  cc_cookie_expires : 30, 
  
  // cookie name
  cc_cookie_name: "cc_cookie",

  // theme css
  cc_theme_css: "/public/assets/css/cookieconsent.css"
  
});

4. API methods.

// show the cookie consent popup
CookieConsent.show(delay);

// hide the cookie consent popup
CookieConsent.hide();

// clear cookies
CookieConsent.clearCookies();

5. Enable a trigger button to toggle the cookie consent popup.

<button type="button" data-cc="cc_policy">Open cookie-policy</button>

Changelog:

09/19/2020

• improve cookie-policy ui

09/15/2020

• bug fixed for IE 8/9.

09/08/2020

• now you can bind any buttons to open the cookie policy

09/08/2020

• cookie-policy-ui update

09/07/2020

• fix minor glitch on small screen devices

09/06/2020

• minor changes

09/04/2020

• fix double saved cookies

09/01/2020

• fix minor glitch