Cookie Hinweis Script

Viele Webseitenbetreiber bauen auf Ihren Homepages inzwischen ein Cookie Hinweis Script ein um die Richtlinie 2009/136/EG der EU umzusetzen. Oder weil sie Google Adsense verwenden wollen und Google das seit dem 30.09.2015 verlangt. Google hat dazu eine eigene Homepage mit Anbietern, wo man sich einen Code für die Anzeige eines Banners generieren kann: https://www.cookiechoices.org/

Ich habe selber das Tool Cookie Consent von Silktide getestet. Es ist kostenlos und funktioniert. Was mich aber daran stört ist, das ich die Optik nicht anpassen kann und es auch externe Dateien nachlädt, wo man sich nicht sicher sein kann, was geladen wird und wie lange es funktioniert.

Deshalb habe ich hier mal einen Code geschrieben, wie man so einen Cookie Hinweis unten auf der Seite einbauen kann. Nur mit Html, Javascript und CSS.

Achtung, der Code ist nur zu Demo Zwecken, wie so etwas technisch und optisch realisierbar ist. Es ist nicht sicher, ob diese Lösung den Anforderungen der EU Richtlinie oder den Anforderungen von Google oder der deutschen Rechtslage entspricht. Wenn man so einen Banner einbauen will, sollte man es unbedingt von einem Rechtsanwalt prüfen lassen.

Hier der Code, der unten vor dem schließenden body Tag eingebaut werden kann:

  1. <!-- Cookie Banner Script Start -->
  2. <style>
  3. #mbmcookie {position: fixed; bottom: 0; left: 0; right: 0; background: #eee; padding: 20px; font-size: 14px; font-family: verdana;}
  4. #mbmcookie a.button {cursor: pointer; background: #ccc; padding: 8px 20px; margin-left: 10px; border-radius: 5px; font-weight: bold; float: right;}
  5. #mbmcookie a.button:hover {background-color: #aaa;}
  6. #mbmcookie p.cookiemessage {display: block; padding: 0; margin: 0;}
  7. </style>
  8. <div id="mbmcookie">
  9. <a onClick="var d = new Date(); d = new Date(d.getTime() +1000*60*60*24*730); document.cookie = 'mbmcookie=1; expires='+ d.toGMTString() + ';'; document.getElementById('mbmcookie').style.display = 'none';" class="button">Akzeptieren</a>
  10. <p class="cookiemessage">Diese Website verwendet Cookies. Durch die Nutzung dieser Webseite erkl&auml;ren Sie sich damit einverstanden, dass Cookies gesetzt werden.
  11. <a href="">Mehr erfahren</a></p>
  12. </div>
  13. <script>
  14. a = document.cookie;while(a != ''){while(a.substr(0,1) == ' '){a = a.substr(1,a.length);}cn = a.substring(0,a.indexOf('='));if(a.indexOf(';') != -1){cw = a.substring(a.indexOf('=')+1,a.indexOf(';'));}else{cw = a.substr(a.indexOf('=')+1,a.length);}if(cn == 'mbmcookie'){r = cw;}i = a.indexOf(';')+1;if(i == 0){i = a.length}a = a.substring(i,a.length);}if(r == '1') document.getElementById('mbmcookie').style.display = 'none';
  15. </script>
  16. <!-- Cookie Banner Script End -->

Den Style Bereich von Zeile 2-7 kann man in eine CSS Datei auslagern. In Zeile 9 bei der Zahl 730 kann man die Anzahl der Tage festlegen, wie lange das Cookie gültig sein soll. In Zeile 11 kann man den Link auf die Datenschutz Seite setzen.

8 Anmerkungen zu “Cookie Hinweis Script

  1. heinz meier

    Leider funktionierts im IE nicht. Unterkategorien im Shop werden ohne css datei angezeigt. Sonst aber ein tolles skript!!!!

    Antworten
    • buhl Autor dieses Beitrags:

      Mit welcher IE Version geht es nicht? Bei mir unter Windows 8 mit Internet Explorer 11 funktioniert es…

      Antworten
  2. Tim

    Sehr tolle Anleitung. Vielen Dank dafür.
    Habe mir einen eigenen Cookie Banner gebaut der mit dem Script aber perfekt läuft.

    Nun würde ich das selbe Script auch nehmen um die Sprachwahl zu realisieren.
    Soweit funktioniert es aber ich müsste ja bei Sprache 1 erstmal wieder den Cookie von Sprache 2 löschen. Sonst hat man beide Cookies und der Browser weiß wieder nicht welche Sprache er nehmen soll.
    Würde mich über eine kurze Hilfe sehr freuen.

    Mit freundlichem Gruß

    Tim

    Antworten
  3. Winfried

    Wunderbar, schönen Dank!! Ich habe das in eine alte statische Seite von mir eingebaut.
    Nur beim Klick auf Akzeptieren verschwindet der Hinweis nicht. Hast Du eine Idee?
    Ich bin mit html nur als Anfänger bewandert, deshalb bitte erklären „wie für Dumme“ ;). Danke Dir.

    Herzliche Grüße

    Winfried

    Antworten
  4. Maria

    Hallo,
    für mich ist das Neuland, daher folgende Frage:
    muss ich diesen Code auf allen html Dateien einfügen, oder nur auf der Index Datei? Und wenn es auf allen eingefügt ist, muss der User dann bei jeder neuen Seite auf „Aktzeptieren“ klicken? Oder ist das Script so geschrieben, dass ein einmaliges Klicken dann für alle Seiten gilt? Danke im voraus!!
    Maria

    Antworten
    • buhl Autor dieses Beitrags:

      Der Code muss auf jeder Seite die man aufrufen kann unten eingebaut sein. Einmal Klicken reicht dann, der Banner erscheint erst nach einem Jahr wieder.

      Antworten

Schreibe einen Kommentar zu Tim Antworten abbrechen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.