My JavaScript book is out! Don't miss the opportunity to upgrade your beginner or average dev skills.

Friday, July 17, 2015

A Simplified EU Cookie Law Approach

Update
Thanks for everyone starring the repo, cookies-monster made it to cdnjs!
I've already talked about the EU cookie law, but moaning about it won't solve the issue. Until common sense and competence will reach European politics so that this law can be erased, we should provide some info to our users.

Not Another Library

There are already few solutions that require a manual or libraries plugins that will cost much bandwidth.
I've decided to use my "special vanilla powers" and go lightweight for real: 578 bytes once "minzipped".
There is absolutely nothing else to do than just including the script. Zero config, drop in and go.

You Are Free To Text & Style

There's no predefined template, there's no predefined style, unless you'd like to use the same I've used for the following page:



You are in charge of the message to show, and you could put an optional link or a button in it with the class cookies-monster-accepted.
If the script will find such button, it will configure it as explicit call to action and once such link/button has been clicked, it will set a cookie that will expire in a year, and it will add the class hidden to the main container which should have a cookies-monster id.
Following an example of the most basic layout.
<div id="cookies-monster" class="hidden">
  This sites uses cookies. <a
    class="cookies-monster-accepted"
    href="#cookies-monster"
  >Accept</a>
</div>

Nothing else ... really

Since you are in charge of pretty much everything, you know what to write on your banner, with the needed language, and with any extra link or option you want. Just stick the script in and you are ready to go!

What would be awesome though, is some star to its repo, even if you have your own solution, so that we can move the script in cdn.js and forget once for all about this problem.

Thank You for reading and contributing!

5 comments:

Unknown said...

Nice Andrea, u rock! In the show function I'm ok with the third one but really cannot figure out the reason for the second check on _el_

Andrea Giammarchi said...

that comes after `el = $(link)` because you might not have put an element with class cookies-monster-accepted inside the container.

If you did, it's going to take care of setting forever the cookie for you, if you didn't it means you are providing your own logic/technique which is fine, and the cookies-monster script just takes care of adding and/or removing CSS classes

Andrea Giammarchi said...

uh wait .. .I might see what you mean ... well, Github is a better place for these things

Andrea Giammarchi said...

FWIW, that's already corrected in 0.1.4 and yes, was there 'cause the if/else logic was different and I just forgot to remove it before. The second one, is still for the link (in case you meant that one)

Cheers

Unknown said...

Allright! the one for the link was clear to me. Thx