jQuery EU Cookie Law popups


The EU Cookie Law does actually seem to apply to most of our websites — we are based in the UK and are using Google Analytics, so there is no way out. Useless as it might be the e-Privacy Directive, the worst part is the scam-like pages that offer “solutions”. Instead, I just went ahead and created a plugin that can be installed by adding 4 lines of code.

An easy-to-install jQuery plugin to create EU Cookie Law popups.

Supports multiple layouts out of the box. Works well with Bootstrap 3. Easy to customize markup and CSS.

This is the demo page. For the code, install instructions and to see how amazingly free it is, go to Github.

Get started

To get started, first include jQuery and import the plugin’s files:

<script src=”js/jquery-2.1.3.min.js”></script>
<link rel=”stylesheet” type=”text/css” href=”css/jquery-eu-cookie-law-popup.css”/>
<script src=”js/jquery-eu-cookie-law-popup.js”></script>

(Mind you, you need to run the code on a webserver to be able to set cookies.)

Simple popup

In its simplest form, you can add an EU Cookie Law popup by simply adding the “eupopup” classes to any HTML tag.
<body class=”eupopup eupopup-top”>

You can also choose from these layouts:

jQuery EU Cookie Law popups (demo)

  • Top of the page (“eupopup”, or “eupopup eupopup-top”)
  • Fixed banner on top (“eupopup eupopup-fixedtop”)
  • Fixed to bottom (“eupopup eupopup-bottom”)
  • Fixed window, to bottom left (“eupopup eupopup-bottomleft”)
  • Fixed window, bottom right (“eupopup eupopup-bottomright”)
  • Inline (“eupopup eupopup-block”)

And these colours or styles:

jQuery EU Cookie Law popups (demo)

  • White text on dark background (“eupopup-color-default”)
  • Dark text on light background (“eupopup-color-inverse”)
  • Compact (“eupopup-style-compact”)

Custom HTML

To use a custom HTML markup, you can either add it as a Javascript parameter (read about it later), or by adding a DIV with the classname “eupopup-markup”.
<div class=”eupopup eupopup-container eupopup-container-block”>
  <div class=”eupopup-markup”>
    <div class=”eupopup-head”>This website is using cookies</div>
    <div class=”eupopup-body”>We use cookies to ensure that we give you the best experience on our website. If you continue using the site, we\’ll assume that you are happy to receive all cookies on this website.</div>
    <div class=”eupopup-buttons”>
      <a href=”#” class=”eupopup-button eupopup-button_1″>Continue</a>
      <a href=”http://www.wimagguc.com/?cookie-policy” target=”_blank” class=”eupopup-button eupopup-button_2″>Learn more</a>
    </div>
    <div class=”clearfix”></div>
    <a href=”#” class=”eupopup-closebutton”>x</a>
  </div>
</div>

Parameters

The script takes quite a few parameters. The suggested method to override these is from the init method (find the out-of-the-box one in the jquery-eu-cookie-law-popup.js):
$(document).euCookieLawPopup().init({
  cookiePolicyUrl : ‘http://www.wimagguc.com/?cookie-policy’,
  popupPosition : ‘top’,
  colorStyle : ‘default’,
  compactStyle : false,
  popupTitle : ‘This website is using cookies’,
  popupText : ‘We use cookies to ensure that we give you the best experience on our website. If you continue without changing your settings, we\’ll assume that you are happy to receive all cookies on this website.’,
  buttonContinueTitle : ‘Continue’,
  buttonLearnmoreTitle : ‘Learn more’,
  buttonLearnmoreOpenInNewWindow : true,
  agreementExpiresInDays : 30,
  autoAcceptCookiePolicy : false,
  htmlMarkup : null
});

Events

If you need to be notified about the consent somewhere in your code (for example, to enable the cookies in other parts of your software), you can listen to the ‘user_cookie_consent_changed’ event.
$(document).bind(“user_cookie_consent_changed”, function(event, object) {
  // true or false
  console.log(“User consent: ” + $(object).attr(‘consent’) );
});

As seen on

Bunt Creative,
Divespy,
Appwoodoo

…and perhaps many more in the EU :)

Released under MIT, do-with-the-code-whatever-you-please License

Subscribe for code updates!
(Powered by MailChimp. Unsubscribe anytime with one click.)

IBM is not Nerdwana

So when I get offered a $2000 visitor pass for a tech conference plus a flight ticket and accommodation in Las Vegas, then I say yes and start packing my bags. Even if IBM Interconnect does not particularly sound fun, and even if I could point out almost infinite number of better things to spend that money on.

IBM used to be the place where you send your resume only if you don’t consider technology being especially precious. Their products are as uncool as Windows XP was for OS – but where Microsoft developers are crazy awesome hackers, IBM seems to exclusively hire sales people. And now, the Big Blue gives the world Watson. The one-stop shop for artificial intelligence. That is a solid, fun, innovative thing to do, and mind you: it’s not a startup building AI-as-a-service first, but people from the Dilbert strips.

I’m with one of the first startups here that can get their hands on Watson, so I’m very excited to visit all workshops and see what is there to learn.

This is chess, and this is boxing

Two people face each other in the box ring, full of muscles and full of tension. Sweat is rolling down on one guy’s face and blood on the other’s, as they are: hunching over a chess board.

The two opponents have noise-cancelling headphones on to filter out the classical music we hear, and I wonder how much a headphone can do about the blood rush in the head. Because one of the guys does not look great. And he has about one minute left to win this game by chess mate, before the fight music returns, and his opponent begins throwing uppercuts to his head.

This is the wonderful sport of chess boxing.

We went for a real mens’ night out with friends a while back, and discovered chess boxing on an “Intellectual Fight Night”. The full article I wrote after the event continues on Yakuzuzu.

Kickstart any app idea: our recipe

It’s easy to be in the centre of attention if you have something cool to offer. Developers are a hot asset now: every now and then, someone wants our agency to do a mobile app for revenue share, a website for future profit, or me, in person, to be the CTO of a new gig.

I love all these projects.

No, really, I do.

Let’s create something impossible

Flipped through this hip ebook, listing 100 startup people from Berlin in 2014. Hundred people, that’s a lot. Hundred startups, that’s, yeah, a lot.

A lot of ideas a hundred, not a surprise therefore that most of the ideas are very similar. But then, if all these startups are going to fail, or at least the better part of them, why are the ideas so similar and mundane? Why not starting something actually exciting, that makes you want to wake up every day?

Startups, why don’t you learn from corporates?

Right on, you got the title right. While I’m helping large companies implementing startup techniques in their work culture, it always leaves me surprised how young upstarts have an attitude towards learning from anyone else.

If you are a startup though, you shouldn’t forget that corporates are entrepreneurs too – they are just a bit different. And those differences are not necessarily all that bad; there are at least a few lessons you can take away from them.

So what secrets can startups learn from a big mammoth? Here are my favourites.

How I messed up being vegetarian

Being vegetarian is awesome. Living with a smaller footprint and in harmony with the environment, contributing to a more sustainable life while taking good care of your health. Who doesn’t want this? This last New Years Eve I tried to remove meat from my diet altogether – just to find myself in misery a few months after.

Bitcoin to save Prague (and tourism overall)

Do you know how much a coffee costs in Prague?

£5,40. That’s almost twice as much as it is in London.

Thanks to the snow and a missed connection, I’ve had unexpected hours to kill in Prague. I’ve bought some cakes, wrote this article – and realised the true value of Bitcoin.

Hong Kong Electronics Fair – tech insights for 2014

Being in the mobile software business in US or Europe, you might think that visiting an all-electronics fair in China is simply irrelevant. But it’s not.

This is a sneak peek into your future

Hong Kong Electronics Fair: tech insights for 2014 by Richard Dancsi
View of the Hong Kong Expo building from the Kowloon pier.

Bintan, Indonesia: free wallpaper downloads

Bintan, Indonesia is a truly beautiful island with gorgeous blue skies and a turquoise sea, so it’s no wonder that we took some pictures before jumping in the water. These photos then ended up being my wallpaper, bringing the summer to the cold Northern Europe. Please find the screens available for download (released under free-and-do-whatever-with-it license).

Bintan, Indonesia - free wallpaper from Wimagguc