Bootstrap-Cookie-Alert

A simple, good looking cookie alert build for Bootstrap 4. No dependencies required.

Demo

I unfortunately dont remeber the source of the cubes pattern :( If someone know, please email me or create an issue. I would love to credit the author.

npm package

npm i bootstrap-cookie-alert
I try to keep it up-to-date. Let me know if I forget to release an update.

How to use

1. In the head of your document, include cookiealert.css after Bootstrap.

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

2. Add the html markup:

<!-- COOKIES -->
<div class="alert text-center cookiealert" role="alert">
    <b>Do you like cookies?</b> &#x1F36A; We use cookies to ensure you get the best experience on our website. <a href="http://cookiesandyou.com/" target="_blank">Learn more</a>

    <button type="button" class="btn btn-primary btn-sm acceptcookies" aria-label="Close">
        I agree
    </button>
</div>
<!-- /COOKIES -->

3. Include the JavaScript after the html markup

<script src="cookiealert-standalone.js"></script>

Take a look at demo.html for a working example

Note:
Both standalone and dependency versions accomplish the same. The dependency version is a little bit smaller and cleaner, but requires jQuery and jsCookie. Use it only if you already have those libraries included on your site. If not, it is strongly recommended to omit loading additional libraries and go with the standalone version.

This site is open source. Improve this page.