Cookier is a lightweight, customizable cookie consent banner that informs users about cookie usage. It includes a simple "accept" button and a link for more information about cookies.
- Cookie consent banner: Displays a notification informing users about cookies.
- Accept button: Users can close the banner using a close (X) button, which stores a cookie in their browser.
- Learn more link: A customizable link that explains what cookies are.
- Responsive design: The banner adjusts for different screen sizes.
To implement Cookier in your project, follow these steps:
- Place the following HTML snippet where you'd like the cookie consent banner to appear in your code (typically just inside the
<body>tag):
<div id="cookierBanner" class="cookierAlert">
<p>It doesn't change anything, but we must inform you that we use cookies.</p>
<a href="https://www.cookiesandyou.com/" target="_blank">What are cookies?</a>
<button id="closeCookierButton" class="closeCookierButton">X</button>
</div>- Place cookier.css in your project CSS folder (or wherever you hold styles) and link it:
<link rel="stylesheet" href="css/cookier.css"/>- Include cookier.js in your project JS folder (or wherever you hold scripts) and link it:
<script src="js/cookier.js"></script>You can easily:
- Change the consent message and link in the HTML.
- Adjust the look and feel by modifying the CSS.
- Change the cookie expiration or behavior by editing the JavaScript.
Works in all modern browsers. Tested on Chrome, Firefox, Edge, and Safari.
This project is licensed under the MIT License. See the LICENSE file for details.
If you find this project helpful or fun to use, consider supporting me on Ko-fi! Your support helps me keep creating and improving.
