Top Related Projects
A free solution to the EU, GDPR, and California Cookie Laws
Klaro Privacy Manager. An open-source, privacy-friendly & compliant consent manager for your website.
Quick Overview
Osano's Cookie Consent is a lightweight JavaScript plugin for alerting users about the use of cookies on a website. It helps website owners comply with cookie laws by providing a customizable banner that informs visitors about cookie usage and allows them to give or withdraw consent.
Pros
- Easy to implement and customize
- Lightweight and fast-loading
- Compliant with GDPR and other cookie regulations
- Supports multiple languages and themes
Cons
- Limited advanced features compared to some paid alternatives
- May require additional configuration for complex cookie scenarios
- Documentation could be more comprehensive
- Some users report occasional issues with specific browser versions
Code Examples
- Basic implementation:
window.cookieconsent.initialise({
"palette": {
"popup": {
"background": "#000"
},
"button": {
"background": "#f1d600"
}
},
"content": {
"message": "This website uses cookies to ensure you get the best experience on our website.",
"dismiss": "Got it!",
"link": "Learn more"
}
});
- Customizing cookie expiration:
window.cookieconsent.initialise({
"cookie": {
"expiryDays": 30
},
// other options...
});
- Handling user consent:
window.cookieconsent.initialise({
onStatusChange: function(status) {
console.log(this.hasConsented() ? 'enable cookies' : 'disable cookies');
},
// other options...
});
Getting Started
- Include the Cookie Consent CSS and JavaScript files in your HTML:
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css" />
<script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js"></script>
- Initialize Cookie Consent with your desired options:
window.addEventListener("load", function(){
window.cookieconsent.initialise({
"palette": {
"popup": {
"background": "#edeff5",
"text": "#838391"
},
"button": {
"background": "#4b81e8"
}
},
"content": {
"message": "This website uses cookies to ensure you get the best experience on our website.",
"dismiss": "Got it!",
"link": "Learn more"
}
})
});
This basic setup will display a cookie consent banner with customized colors and text. Adjust the options as needed for your specific requirements.
Competitor Comparisons
A free solution to the EU, GDPR, and California Cookie Laws
Pros of cookieconsent
- More actively maintained with recent updates
- Larger community and user base
- Better documentation and examples
Cons of cookieconsent
- Slightly larger file size
- May have more features than needed for simple use cases
Code Comparison
cookieconsent:
window.cookieconsent.initialise({
"palette": {
"popup": {
"background": "#000"
},
"button": {
"background": "#f1d600"
}
},
"theme": "classic",
"content": {
"message": "This website uses cookies to ensure you get the best experience on our website.",
"dismiss": "Got it!",
"link": "Learn more"
}
});
cookieconsent>:
// No direct code comparison available as cookieconsent> is not a valid repository
Summary
cookieconsent is a well-maintained and widely-used cookie consent solution with extensive documentation and community support. It offers a range of customization options and features, which may be more than necessary for simple implementations. The slightly larger file size could be a minor drawback for performance-critical applications. As cookieconsent> is not a valid repository, a direct comparison is not possible, and the information provided is based solely on the characteristics of cookieconsent.
Klaro Privacy Manager. An open-source, privacy-friendly & compliant consent manager for your website.
Pros of Klaro
- More customizable and flexible, allowing for advanced configurations
- Supports multiple languages out of the box
- Actively maintained with regular updates and improvements
Cons of Klaro
- Steeper learning curve due to its advanced features
- Slightly larger file size, which may impact page load times
- Less extensive documentation compared to Cookieconsent
Code Comparison
Klaro configuration example:
var klaroConfig = {
elementID: 'klaro',
storageMethod: 'cookie',
cookieName: 'klaro',
cookieExpiresAfterDays: 365,
default: false,
mustConsent: true,
acceptAll: true,
hideDeclineAll: false,
hideLearnMore: false,
translations: {
en: {
privacyPolicyUrl: '/privacy-policy',
},
},
services: [
{
name: 'google-analytics',
default: true,
title: 'Google Analytics',
purposes: ['analytics'],
},
],
};
Cookieconsent configuration example:
window.cookieconsent.initialise({
palette: {
popup: { background: "#000" },
button: { background: "#f1d600" },
},
type: "opt-in",
content: {
message: "This website uses cookies to ensure you get the best experience.",
dismiss: "Got it!",
allow: "Allow cookies",
link: "Learn more",
href: "https://cookiesandyou.com",
},
});
Both libraries offer cookie consent functionality, but Klaro provides more granular control over services and translations, while Cookieconsent focuses on simplicity and ease of use.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
What is Cookie Consent?
Cookie Consent is a lightweight JavaScript plugin for alerting users about the use of cookies on your website.
It is designed to help you quickly comply with the EU Cookie Law, CCPA, GDPR and other privacy laws. We made it fast, free, and relatively painless.
Cookie Consent is seen over 2 BILLION times every month and is used on millions of sites, making this by far the most popular consent project on the internet.
We welcome community contributions and actively review pull requests.
Hosted Zero Config Consent
Our parent company Osano actively maintains this open source project. Osano is a B-corp and is backed by millions of dollars in venture capital to create data privacy tools for the world. Our mission is to create transparency in data, please consider joining our team.
Ensuring that your website is compliant with various laws can be complicated. To effectively use any open source consent manager, you will need to do GeoIP lookups, adjust the consent types based on visitor location, callback and save consents in a database, and create callbacks to load scripts after consent is granted.
Osano offers a completely free hosted consent management platform, with additional features. If you have a high traffic website or need additional privacy tools, Osano offers paid plans as well. Unless you specifically need the open source tool, most website owners will be better served by the hosted version. If you use Osano for your business, please support continued development by purchasing a paid plan.
The hosted version of the cookie consent manager provides additional capabilities such as:
- Multi-lingual, translated into 38 languages and growing. Visitors automatically see the dialog in their browser or OS preferred language.
- Consents are stored automatically on the blockchain. REST API calls are available to developers to search and browse the consent records.
- 3rd party script blocking and loading does not require callbacks but is instead configurable from a dashboard providing developers with control over what the marketing team can enable or disable.
- Hosted on AWS Cloudfront with edges around the globe for
Basic Use
With version 4.0 you only need to attach the script as we've bundled everything together now. The initialization style has changed as have the callbacks (they're gone). Please see the text below to get started. Then, take a look at updated API via the docs.
Module
import CC from "CookieConsent"
// or
const CC = require( "CookieConsent" )
Classic
const CC = window.CookieConsent
Initialization:
const cc = new CC({
//...options,
type : "categories"
})
Lifecycle hooks, are now events:
cc.on( "initialized", ( ...args ) => console.log( args ) )
cc.on( "error", console.error )
cc.on( "popupOpened", () => console.log( "Popup Open" ) )
cc.on( "popupClosed", () => console.log( "Popup Closed" ) )
cc.on( "revokeChoice", () => console.log( "Popup Reset" ) )
cc.on( "statusChanged", ( ...args ) => console.log( args ) )
Version 4.0
Lots of updates & some breaking changes... but they're all for the better, we promise!
Version 3.1
Reflects the ownership change of the Cookie Consent project. Now actively maintained by:
- @arlogilbert
- @L0key
- @pgoforth
Version 3.0
Version 3.0 is a complete rewrite from version 2. The most substantial new features are:
- Ability to GeoLocate and only show the add-on to people in the relevant countries
- Callback hooks for showing/accepting/revoking the banner
- Support for different types of compliance, giving you the flexibility to obey even the strictest cookie laws
- Easy no-fuss themes and customisable styles
Installation
The easiest way to get up and running is to use our wizard.
You can also install this project through npm:
npm install cookieconsent
Or through Yarn:
yarn add cookieconsent@3
Or through Bower:
bower install cookieconsent
Or via a jsDelivr:
<script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js"></script>
Documentation
See our full documentation.
Contributing
Feel free to improve the plugin and send us a pull request.
The easiest way to develop is to host the files with a local webserver. e.g.
python -m SimpleHTTPServer
We use Babel, Terser, and PostCSS to compile the SCSS and minify the JavaScript. You can run a build with:
npm run build
or
yarn run build
Legal Mumbo Jumbo
Osano is a registered trademark of Osano, Inc.
Nothing on the Osano website, platform, services, or software, nor any portion thereof constitutes actual legal or regulatory advice, opinion, or recommendation by Osano, Inc. or Osano International Compliance Services LTD.
If legal assistance is required, users should seek the services of an attorney.
Export Control
This distribution includes cryptographic software. The country in which you currently reside may have restrictions on the import, possession, use, and/or re-export to another country, of encryption software. BEFORE using any encryption software, please check your country's laws, regulations and policies concerning the import, possession, or use, and re-export of encryption software, to see if this is permitted. See http://www.wassenaar.org/ for more information.
The U.S. Government Department of Commerce, Bureau of Industry and Security (BIS), has classified this software as Export Commodity Control Number (ECCN) 5D002.C.1, which includes information security software using or performing cryptographic functions with asymmetric algorithms. The form and manner of this Apache Software Foundation distribution makes it eligible for export under the License Exception ENC Technology Software Unrestricted (TSU) exception (see the BIS Export Administration Regulations, Section 740.13) for both object code and source code.
Top Related Projects
A free solution to the EU, GDPR, and California Cookie Laws
Klaro Privacy Manager. An open-source, privacy-friendly & compliant consent manager for your website.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot