Seit dem Inkrafttreten der Cookie-Richtlinie hat sich in einigen europäischen Ländern auf Webseite der Hinweis auf die Verwendung von Cookies eingebürgert. Google verlangt diese Hinweise ab dem 30. September für seine Dienste AdSense und DoubleClick auch in Deutschland. Wer sich darum noch nicht gekümmert hat, kommt vielleicht mit dieser kleinen Lösung schnell zum Ziel.
Notwendig ist auf jeden Fall ein Eingriff in den Quellcode der Webseite – damit sollte man sich also auskennen. Prinzipiell ist auch eine direkte Integration in ein WordPress-Theme möglich, davon geht die Beschreibung hier aber nicht aus.
Technisch existieren keine besonderen Voraussetzungen, jQuery oder andere JavaScript-Bibliotheken sind nicht nötig, nur PHP wird benötigt (ließe sich aber auch durch JavaScript ersetzen).
EU-Cookie-Richtlinie – Google geht auf Nummer Sicher
Inhaltsverzeichnis
Aufbau des Cookie-Hinweises
Zu Beginn muss natürlich erstmal die Cookie-Box entstehen. In vielen Fällen ist der Hinweis mitscrollend am Fuß der Seite platziert. Ebenso oft gibt es den Hinweis auch am oberen Seitenrand. Theoretisch ginge auch seitlich, oder als mitschwebende Box. Diese Lösung beschränkt sich aber auf oben oder unten.
Für die Hinweisbox ist folgender CSS-Code nötig:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
#eu_cookiebox { display: block; z-index: 100; position: fixed; bottom: 0px; min-height: 30px; padding: 5px; margin: 0; width: 100%; color: #555; border: 1px solid black; border-bottom: none; background: #fff; } |
Der Code gestaltet später im Quelltext das DIV mit der ID eu_cookiebox. Das position: fixed sorgt für’s mitscrollen, bottom: 0px platziert das Div am unteren Seitenrand. Wer es oben haben möchte, muss statt bottom einfach top benutzen.
Abstände, Hintergrundfarben etc. lassen sich natürlich auch beliebig anpassen.
JavaScript zum Cookie setzen
Ein kleiner Cookie-Exkurs: Cookies sind ungefähr so alt wie die ersten Webbrowser. Cookies sind kleine Dateien, die von einer Webseite auf dem Rechner des Nutzers gespeichert werden können, um Daten zu speichern, Warenkörbe zu erhalten usw. Das ist ungemein praktisch, bietet aber auch reichlich Möglichkeiten um Schindluder zu treiben.
Klickt der Nutzer in unserer Hinweisbox auf den Einverständnis-Button, bekommt er ironischerweise erstmal gleich einen Cookie gesetzt. Dieser Cookie erhält eine vorgegebene Lebensdauer über einen bestimmten Zeitraum, im Beispiel sind es 30 Tage.
Doch erstmal der JavaScript-Code:
|
1 2 3 4 5 6 7 8 9 10 11 |
<script language="javascript"> function checkok() { var jetzt = new Date(); var lebensdauer = jetzt.getTime(); var verfall = lebensdauer + 2592000000; jetzt.setTime(verfall); var enddate = jetzt.toUTCString(); document.cookie = "fuckeu = set;expires=" + enddate; document.getElementById("eu_cookiebox").style.display = "none"; } </script> |
Als erstes wird die Funktion checkok() definiert. Diese wird später beim Klick auf den Button aufgerufen und setzt den Cookie für den User. Im Anschluss definieren sich die zwei Variablen jetzt (aktuelles Datum) und lebensdauer (aktuelle Zeit).
Der Variablen lebensdauer werden nun noch 30 Tage in Sekunden hinzuaddiert (2592000000). Mit jetzt.SetTime(verfall) wird der Zeitpunkt gesetzt, zu dem der Cookie ungültig wird und mit toUTCString() in ein lesbares Format umgewandelt.
Nach der ganzen Zeitermittlerei wird nun endlich mit dem document.cookie der Cookie gesetzt. Die erste Angabe ist der Name (fuckeu). Das Attribut expires in Verbindung mit der eben zusammengeschraubten Variable enddate setzt das Verfallsdatum des Cookies. Zu der Lebenszeit des Cookies weiter unten noch ein paar Worte.
In der letzten Anweisung wird das DIV der Hinweisbox ausgeblendet.
PHP und HTML für die EU-Hinweisbox
Zu guter Letzt muss natürlich noch das DIV mit dem Hinweis in den Quelltext der Seite eingebaut werden. Zugleich wird eine Abfrage integriert. Diese prüft, ob das Cookie fuckeu bereits gesetzt ist. Denn in diesem Fall wird die Hinweisbox einfach nicht angezeigt.
So könnte die Hinweisbox aussehen
Der Code, am Besten vor dem schließenden Body-Tag:
|
1 2 3 4 5 6 7 8 |
<?php $eu_cookie_set = $_COOKIE["fuckeu"]; if ($eu_cookie_set != "set") { ?> <div id="eu_cookiebox"> Cookies erleichtern die Bereitstellung unserer Dienste. Mit der Nutzung unserer Dienste erklärst du dich damit einverstanden, dass wir Cookies verwenden <a href="#">Mehr Infos</a> <button onclick='checkok()'>OK</button> </div> <?php }; ?> |
Der Code prüft, ob unser Cookie fuckeu gesetzt ist. Ist er das nicht, wird der HTML-Code mit der Hinweisbox an den Browser ausgeliefert, ansonsten nicht.
Beim Klick auf den Button „OK“ wird die Funktion checkok() unseres Javascripts aufgerufen und ausgeführt.
Die Cookie-Laufzeit
Ist die Laufzeit des Cookies von 30 Tagen zu lang? Kein Problem, eine andere Laufzeit lässt sich ganz einfach ausrechnen. Zeiträume benötigen in JavaScript und PHP Angaben in Sekunden. Ein Tag hätte also 60 Sekunden x 60 Minuten x 24 Stunden = 86400 Sekunden.
Ich konnte nirgends eine Angabe finden, wie lange ein „OK“, des Nutzers gelten darf. Für immer? Sollte der Cookie nie verfallen? Oder nur eine Stunde? Was ist, wenn plötzlich ein anderer Nutzer am gleichen Computer sitzt? In der Richtung wird es wohl noch einiges zu klären geben.
Hallo nettes, kleines Script. Wo kann man: “ Secure und HttpOnly“ einfügen??
Sorry ich scheitere beim Versuch den „cookie“ zu simulieren. Beim Localhost aufruf erscheint Fehlermeldung „parse error, unexpected end of file wobei es eigentlich nur an den Einträgen
liegen kann. Ohne diesen Eintrag wird mir die Box aufgebaut.