Datenschutz-Hinweis über Cookies dauerhaft ausblenden

Hier zeige ich, wie der Datenschutz-Hinweis über Cookies (LocalStorage) dauerhaft ausgeblendet werden kann. Natürlich verschwindet der Hinweis nur, so lange wie die Cookies im Browser erhalten bleiben.

1. Dieses JavaScript kommt in den <head>-Bereich.

<script>
window.addEventListener("DOMContentLoaded", function () {
 if ('localStorage' in window &&
     window['localStorage'] !== null) {
  if (window.localStorage.getItem("DSGVO")) {
   document.getElementById("dsgvo_hinweis").style.display="none";
  }
 }
});

function akzeptieren() {
 if ('localStorage' in window &&
     window['localStorage'] !== null) {
  window.localStorage.setItem("DSGVO", "true");
  document.getElementById("dsgvo_hinweis").style.display="none";
 }
}
</script>

2. Um den Datenschutz-Hinweis etwas zu stylen, benötigt man diese CSS-Angaben (kann natürlich angepasst werden).

<style>
/* DSGVO */
div#dsgvo_hinweis {
 position: Fixed;
 bottom: 0px;
 left: 0px;
 width: 100%;
 z-index: 1000;
 text-align: Center;
 cursor: Default;
 background-color: rgba(234, 239, 241, 0.9);
 border-top: Solid 1px rgb(168, 188, 198);
}

a.dsgvo_hinweis_button {
 text-decoration: None;
 padding: 7px;
 background-color: rgb(0, 191, 0);
 color: rgb(255, 255, 255);
 margin-right: 10px;
}

a.dsgvo_button:hover {
 background-color: rgb(0, 166, 0);
}
</style>

3. Als letztes wird noch der Datenschutz-Hinweis (HTML-Code) benötigt, dieser sollte am Ende der Seite eingefügt werden.

<div id="dsgvo_hinweis">

<p>
 Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
</p>

<p>
 <a href="#" class="dsgvo_hinweis_button">Datenschutzerklärung</a>
 <a href="javascript:akzeptieren();" class="dsgvo_hinweis_button">Akzeptieren</a>
</p>

</div>

Tipps

Webseiten schneller machen: Webseitenbesucher sind ungeduldig, um Besucher und Suchmaschinen bei der Stange zu halten, darf Ihre Website keine Zeit verlieren.

Browser-Sprachumschaltung: Diese Sprachumschaltung zeigt je nach der verwendeten Sprache (deutsch, englisch, ...) im Browser unterschiedlichen Inhalt an.

Sitemaps-Protokoll für Suchmaschinen automatisch erstellen: Sorgen Sie dafür, dass die Nutzer auf einen größeren Teil Ihrer Website aufmerksam werden mit einem „Sitemaps-Protokoll”. Dies stellt eine einfache Möglichkeit für Webmaster dar, Suchmaschinen Seiten auf Ihrer Website zu melden, die zum durchsuchen verfügbar sind.