Opt-in Cookies

Guten Morgen,

ich habe ein kleines Anliegen zum Thema Cookies. Für meine Webseite möchte ich Opt-In Cookie verwenden, die gespeichert, ausgelesen und gelöscht werden können. Außerdem möchte ich dem Nutzer gerne eine Mitteilung erscheinen lassen, mit dem Hinweis in dem der Name des Besuchers gespeichert wurde. Ich habe es ein bisschen in JavaScript versucht, erzeuge aber nicht das gewünschte Ergebnis. Ich bekomme auch keine Cookies in den Applications der Webseite angezeigt. Java Script ist relativ neu für mich, ich kenne mich also noch nicht so gut aus. Wie kann ich nun die Cookies für meine Webseite erzeugen? Mit dem nachgeführten Beispiel klappt es nicht. Die vorgefertigte Architektur habe ich von der Seite Cookie Consent.

schönen Tag und sonnige Grüße

Java Script:


<script>

window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#343a40",
      "text": "#ffa500"
    },
    "button": {
      "background": "#008000",
      "text": "#ffffff"
    }
  },
  "theme": "classic",
  "position": "bottom-right",
  "type": "opt-in",
  "content": {
    "message": "Diese Website verwendet Cookies, um Inhalte und Anzeigen zu analysieren.",
    "dismiss": "Nein danke",
    "allow": "Ja, Cookies",
    "link": "mehr!",
    "href": "https://www/"
  }
});
</script>

<script>


function setCookie(){

document.cookie = "isread=1; expires=So, 2 Aug 2020 12:00:00 UTC; path=/";
var myCookie = document.cookie;

function cookiesEnabled () {
    let cookieEnabled = (navigator.cookieEnabled) ? true : false;

    if (typeof navigator.cookieEnabled == "undefined" && !cookieEnabled) { 
        document.cookie="mycookie";
        cookieEnabled = (document.cookie.indexOf("mycookie") != -1) ? true : false;
    }
    return (cookieEnabled);
}

}

</script>

Hey, danke schonmal für deine Antwort.

mit der Cookieconsent implementierung habe ich ja schon einen Button erzeugt, bei dem decline und accept möglich ist. Eben aber nicht in Html. Siehe nochmal wie oben:

<script>
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#343a40",
      "text": "#ffa500"
    },
    "button": {
      "background": "#008000",
      "text": "#ffffff"
    }......

oder soll ich neue Buttons auf der Seite erzeugen?

viele Grüße

das ist auf jeden Fall schon einmal funktionaler als mein Versuch, danke. Auch für den Hinweis.

Jetzt bekomme ich mit deinem Code aber immer noch kein Cookie im (Seite) "Untersuchen">> "Anwendungen" Fenster. Ich möchte ja irgendwo sehen , oder einen Beweis, dass Cookies gespeichert sind.

Das mit dem Namen war eigentlich eher optional gedacht. Also zu Beginn kommt ein Fenster in dem sich der User einträgt und das ist dann die Grundlage für den Cookie. Das war die Idee, wie ich das umsetze, da bin ich eben leider überfragt..

schönen Abend

Morgen,

reicht hier dein Code aus?

let allowButton = document.getElementsByClassName("cc-allow");
allowButton[0].addEventListener("click", function(){
    setCookie();
});

Ich bekomme bei "Anwendungen" noch immer kein Cookie angezeigt.

viele Grüße

Zitat von basti1012

Du brauchst das alles doch nur zusammen bauen.

So ungefähr , jenachdem was du genau vor hast mit den Besuchernamen

https://codepen.io/basti1012/pen/KKVovZB?editors=1000

kann ich den Namenseintrag auch irgendwie im Cookiepop-up machen?

Das wäre schön. Der Name soll eigentlich nur kurz gespeichert werden. Also ich will ihn nicht verwenden.

Aber warum kann ich bei "Anwendungen" immer noch keine Cookies sehen? Ich habe dein Beispiel genommen und auf der Seite konnte ich auch eines identifizieren. Nur bei meiner Seite nicht?!

Zitat von Stef

Hey,

Bei mir werden Cookies gesetzt.

Liegt es daran, dass das Script geladen wird bevor die Seite komplett geladen ist?

Füge mal bitte um den JavaScript Code den EventListener Load hinzu. In diesem führst du dann all deinen Code aus.

Dieser EventListener wartet bis die Seite vollständig geladen ist und führt dann den Code der in diesem steht aus.

Schöne Grüße

Alles anzeigen

Den habe ich eigentlich gesetzt ..

window.addEventListener("load", function(){
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#343a40",
      "text": "#ffa500"
    },
    "button": {
       "background": "#008000",
      "text": "#ffffff"
    }
  },...

mmh, geht immer noch nicht...

Zitat von basti1012

Du meinst neben den akzeptieren Button ?

Klar.

Man könnte das mit Javascript dazu fummeln , oder man bearbeitet das mitgelieferte Script was wahrscheinlich einfacher wäre, dann könnte man den anderen Code auch gleich da bearbeiten

ich weiß gerade leider nicht, wie ich das umsetzen soll. Wie gesagt, ich bin noch nicht sehr fit mit Java Script.

window.addEventListener("load", function(){
window.cookieconsent.initialise({
  "palette": {
    "popup": {
      "background": "#343a40",
      "text": "#ffa500"
    },
    "button": {
       "background": "#008000",
      "text": "#ffffff"
    }
  },
  "theme": "classic",
  "position": "bottom-right",
  "type": "opt-in",
  "content": {
     "message": "Diese Website verwendet Cookies, um Inhalte und Anzeigen zu analysieren.",
    "dismiss": "Nein danke",
     "theme":"<?php $cookiethema; ?>",
    "allow": "Ja, Cookies",
    "link": "mehr!",
    "href": "https://www.hm.edu/datenschutz/"
    }
})
});

setTimeout(function(){
 but=document.getElementsByClassName('cc-allow')[0];
  but.style.border='5px solid red';
  but.addEventListener('click',function(g){
    setCookie();
  })
                                         
 },1000);
 

</script>
<script>
  try{
        ti=document.cookie.split('besuchername=')[1].split(';')[0]; 
  document.getElementsByTagName('body')[0].innerHTML+=ti+' Willkommen zurück';
    }catch(e){
      nameform=document.createElement('div');
      nameform.innerHTML='<h2>Gebe deinen Namen ein und bestätige den Cookie Hinweiß</h2><input type="text" id="name">';
      document.getElementsByTagName('body')[0].appendChild(nameform);
    }
  
function setCookie(){
    let name=document.getElementById('name').value;
    document.cookie = "besuchername="+name+";isread=1; expires=So, 2 Aug 2020 12:00:00 UTC; path=/";
}







</script>

Das ist der gesamte Script Code.

In der Konsole wird nichts angezeigt, also keine Fehlermeldung

Zitat von Stef

Hey,

hast du denn auch die JS & CSS-Datei von Cookie Consent eingebunden?

Code

<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css" />
<script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js" data-cfasync="false"></script>

Außerdem:

In der Funktion, des EventListeners Load, soll der ganze JavaScript Code liegen. Du hast immernoch 2 <script>-Tags.

Wenn du alle Dateien (CSS & JS) korrekt einbindest und der ganze Code in der Funktion des EventListeners Load liegt läuft es. Siehe cookie.png.

Schöne Grüße

Alles anzeigen

mmmh, ja ist alles eingebunden.

Trotzdem noch kein Cookie..