FriendsOfREDAXO Consent Manager Save

Stellt ein Opt-In Cookie Banner zur Verfügung

Project README

Consent-Manager für das REDAXO CMS

logo

Stellt ein Datenschutz-Opt-In-Banner für Dienste und ggf. deren zugehörige Cookies zur Verfügung. Die Dienste können in selbst definierte Gruppen zusammengefasst werden. Der Website Besucher bekommt eine Consent-Box angezeigt in der er allen oder einzelnen Dienste-Gruppen zustimmen kann. Es existiert eine Gruppe Notwendig, die nicht deaktiviert werden kann. Die Consent-Box kann erneut (zum Beispiel über einen Link im Impressum, oder Footer) aufgerufen werden. So können nachträglich Änderungen durchgeführt werden. Alle Texte sowie die Gestaltung der Consent-Box sind frei konfigurierbar. Eine Themeauswahl bietet unterschiedliche Designs für den Start.

Rechtlicher Hinweis

Die im AddOn gelieferten Texte und Cookie-Definitionen sind Beispiele und ggf. unvollständig oder nicht aktuell. Es liegt in der Verantwortung der Betreiber und Entwickler der Website sicherzustellen, das die Funktionalität der Abfrage, die Texte, Dienste, Cookies der geltenden Rechtslage und den Datenschutzbestimmungen entsprechen. Dies gilt auch für die korrekte Integration der Lösung.

Wir empfehlen für die Formulierung der Texte und Cookie-Listen Spezialisten zu kontaktieren. (z.B: Datenschutzbeauftragte, Rechtsabteilung)

Screenshot

Kurzanleitung

  1. AddOn consent_manager über den Installer herunterladen und installieren.
  2. Domains hinterlegen
  3. Dienste anlegen und JS Scripte hinterlegen
  4. Dienste-Gruppen anlegen
  5. Der jeweiligen Domain-Gruppe die gewünschten Domains und Dienste zuordnen
  6. REX_CONSENT_MANAGER[forceCache=0 forceReload=0] in den <head>-Bereich der gewünschten Templates einfügen, bzw.
    echo consent_manager_frontend::getFragment(false, false, 'consent_manager_box_cssjs.php');,
    wenn via PHP.
  7. Alle weiteren Einstellungen sind optional.

Hinweis: Wird keine Auswahlbox angezeigt Punkte 2 bis 6 nochmal checken ... und/oder siehe Fehlerbehebung

Hinweis: Im Reiter Setup besteht die Möglichkeit einen Import gängiger Dienste durchzuführen.

Einrichten

Domains hinzufügen

Consent-Manager kann für mehrere Domains einzeln gesteuert werden. Jede Domain der REDAXO-Instanz die Consent-Manager nutzen soll muss einzeln (ohne Protokoll http/https) hinterlegt werden.

Zum Beispiel: www.meinedomain.tld und meinedomain.tld

Die Datenschutzerklärung und das Impressum wird für jede Domain hinterlegt. Die Seiten werden nachher automatisch in der Consent-Box verlinkt. Beim Aufruf wird die hier hinterlegte Domain mit $_SERVER['HTTP_HOST'] verglichen und die Consent-Box wird bei Übereinstimmung angezeigt.

Dienste anlegen

Für jeden Dienst (zum Beispiel Google Analytics oder Matamo) wird ein einzelner Eintrag erstellt. Hat ein Dienst mehrere Cookies werden diese trotzdem in einem einzigen Eintrag beschrieben. Alle Angaben dienen nur zur Information des Webseiten Besuchers und haben keinen Einfluss auf das Setzen/Löschen der Cookies bzw. deren Eigenschaften! Im Reiter Setup besteht die Möglichkeit einen Import gängiger Dienste durchzuführen.

Screenshot

Schlüssel:

ist zur internen Verwendung und darf keine Sonderzeichen/Leerzeichen enthalten.

Dienstname:

wird später in der Consent-Box angezeigt.

enthält die Beschreibung aller Cookies des Dienstes die in der Consent-Box angezeigt werden sollen. Die Beschreibung wird im YAML-Format hinterlegt, zum Beispiel:

-
 name: _ga
 time: 2 Jahre
 desc: Speichert für jeden Besucher der Website eine anonyme ID. Anhand der ID können Seitenaufrufe einem Besucher zugeordnet werden.
-
 name: _gat
 time: 1 Tag
 desc: Verhindert, dass in zu schneller Folge Daten an den Analytics Server übertragen werden.
-
 name: _gid
 time: 1 Tag
 desc: Speichert für jeden Besucher der Website eine anonyme ID. Anhand der ID können Seitenaufrufe einem Besucher zugeordnet werden.

Anbieter:

Hier kann optional der Anbieter hinterlegt werden (zum Beispiel Google). Die Angaben werden in der Beschreibung angzeigt.

Standardmäßig wird die Datenschutzerklärung der Domain angezeigt. Exisitiert für den Dienst eine separate Datenschutzerklärung (zum Beispiel: https://policies.google.com/privacy) kann diese hier hinterlegt werden. Auch REDAXO-Links (redaxo://1) können genutzt werden.

Platzhalter Text:

Hier kann optional ein Platzhalter Text hinterlegt werden

Platzhalter Bild:

Hier kann optional ein Platzhalter Bild aus dem Medienpoolhinterlegt werden

Skripte, die nach Einverständnis geladen werden:

Hier werden alle Scripte (inklusive <script>-Tag hinterlegt, die geladen werden, sobald der Nutzer mit der Gruppe einverstanden ist). Werden unterschiedliche Skripte je Domain benötigt, muss je Domain der Dienst extra angelegt werden. Die Scripte müssen nicht inline ausgeführt werden. Aufrufe externer Scripte sind möglich, z.B.: <script type="text/javascript" src="/ressources/script.js">.

Gruppen anlegen

Gruppen sind die Gruppen, die der Websitebsucher später einzeln akzeptieren oder ablehnen kann. Außerdem werden hier über die zugewiesenen Dienste die Scripte hinterlegt, die geladen werden, sobald der Benutzer die Gruppe akzeptiert hat.

Screenshot

Feld Beschreibung
Schlüssel Zur internen Verwendung und darf keine Sonderzeichen/Leerzeichen enthalten
Technisch notwendige Dienste Wenn aktiv, wird die Gruppe vorausgewählt und kann nicht deaktiviert werden Dienste
Domain Hier wird die zuvor angelegte Domain ausgewählt, bei deren Aufruf die Gruppe angezeigt werden soll.
Name Name der Gruppe (wird dem Website-Besucher angezeigt).
Beschreibung Allgmeine Beschreibung der Gruppe (wird dem Website-Besucher angezeigt).
Dienste Hier werden die zuvor angelegten Dienste ausgewählt, die der Gruppe angehören sollen

Beispielkonfiguration importieren

Über den Menüpunkt Setup kann eine Beispielkonfiguration mit Gruppen importiert werden. Vorhandene Dienste und Gruppen werden dabei gelöscht!

Im Template einfügen

Der Platzhalter REX_CONSENT_MANAGER[] wird im <head>-Bereich des Templates oder vor dem </body>-Tag eingefügt. Gibt es mehrere Templates die die Consent-Box aufrufen sollen, muss der Platzhalter entsprechend in allen Templates eingefügt werden.

Wichtig: Der Platzhalter funktioniert ausschließlich in REDAXO-Templates, nicht innerhalb von php-includes, Modulen oder Fragmenten.

Durch den Parameter forceReload=1 kann ein Reload der Webseite bei Auswahl der Cookies erzwungen werden. REX_CONSENT_MANAGER[forceReload=1]

Beispiel:

<head>
    <meta charset="UTF-8">
    <title>Meine Webseite</title>
    ...
    <link rel="stylesheet" href="<?php echo template_asset_url('theme/css/meincss.min.css'); ?>">
REX_CONSENT_MANAGER[forceReload=1]
</head>

oder

<head>
    <meta charset="UTF-8">
    <title>Meine Webseite</title>
    ...
    <link rel="stylesheet" href="<?php echo template_asset_url('theme/css/meincss.min.css'); ?>">
</head>
<body>
    ...
REX_CONSENT_MANAGER[forceReload=1]
</body>

Beispiel PHP-Ausgabe

...
<body>
...
<?php echo consent_manager_frontend::getFragment(false, false, 'consent_manager_box_cssjs.php'); ?>
...
</body>
...

Beispiel-Modul zur nachträglichen Abfrage

Eingabe-Modul (mit MForm)

<?php
$mform = new mform();
$cookies = [];
$qry = 'SELECT uid,service_name FROM '.rex::getTable('consent_manager_cookie').' WHERE clang_id = '.rex_clang::getCurrentId();
foreach (rex_sql::factory()->getArray($qry) as $v) {
    if ($v['uid'] == 'consent_manager') continue;
    $cookies[$v['uid']] = $v['service_name'];
}
$mform->addSelectField(1);
$mform->setOptions($cookies);
$mform->setSize(1);
$mform->setLabel('Dienst');

$mform->addTextAreaField(2, ['label' => 'HTML/JS das bei Consent geladen wird']);
$mform->addCheckboxField(5, [1 => 'Seitenreload nötig']);

$mform->addTextAreaField(3, ['label' => 'Platzhaltertext']);
$mform->addMediaField(1, ['label' => 'Platzhalterbild']);

echo $mform->show();

Ausgabe-Modul

<?php
$serviceName = '';
$cookieUid = 'REX_VALUE[1]';
$needsReload = (bool)'REX_VALUE[5]' ? '-reload' : '';
$consented = false;
$placeholderImage = '';
$placeholderText = '';

$consent_manager = new consent_manager_frontend();
$consent_manager->setDomain($_SERVER['HTTP_HOST']);

// "globale" platzhalter aus dem addon setzen
if (isset($consent_manager->cookies[$cookieUid])) {
    $placeholderImage = $consent_manager->cookies[$cookieUid]['placeholder_image'];
    $placeholderText = $consent_manager->cookies[$cookieUid]['placeholder_text'];
}

if (isset($_COOKIE['consent_manager'])) {
    $cookieData = json_decode($_COOKIE['consent_manager'], true);
    foreach ($cookieData['consents'] as $consent) {
        if ($cookieUid == $consent) {
            $consented = true;
            break;
        }
    }

}
?>

<?php if (rex::isFrontend()): ?>
    <?php if ($consented): ?>
        <div class="consent_manager-module" data-uid="<?= $cookieUid ?>">
            REX_VALUE[2 output=html]
        </div>
    <?php else: ?>
        <div class="consent_manager-module" data-payload="<?= base64_encode('REX_VALUE[2 output=html]') ?>" data-uid="<?= $cookieUid ?>">
            <div class="consent_manager-module__placeholder">
                <div class="consent_manager-module__placeholder-image">
                    <img src="/media/<?= ('REX_MEDIA[1]' ? 'REX_MEDIA[1]' : $placeholderImage) ?>" alt="">
                </div>
                <div class="consent_manager-module__placeholder-text">
                    <div class="consent_manager-module__placeholder-text-background">
                        <?= nl2br('REX_VALUE[3 output=html]' ? 'REX_VALUE[3 output=html]' : $placeholderText) ?>
                        <div class="consent_manager-show-box<?= $needsReload ?>"><b>Datenschutz-Einstellungen anpassen</b></div>
                    </div>
                </div>
            </div>
        </div>
    <?php endif ?>
<?php else: ?>
    <label><?= $serviceName ?></label>
    <textarea readonly disabled style="width:100%;" id="consent_manager-module-textarea-REX_SLICE_ID">REX_VALUE[2 output=html]</textarea>
<?php endif ?>

zusätzliches JS

jQuery(function ($) {
    'use strict';
    $('.consent_manager-module').each(function () {
        var $this = $(this),
            uid = $this.data('uid');
        $(document).on('consent_manager-saved', function (e) {
            var consents = JSON.parse(e.originalEvent.detail);
            consents.forEach(function (v) {
                if (v === uid) {
                    $this.html(window.atob($this.data('payload')));
                }
            });
        });
    });
});

Einstellungen und Optionen

Die folgenden Einstellungen sind optional. Mit ihnen kann man Consent-Manager an die eigenen Bedürfnisse anpassen. Sie ändern jedoch nichts an der Funktionalität des AddOns.

Dienste-Texte anpassen

Hier können alle allgemeinen Texte der Consent-Box angepasst werden.

Wir empfehlen hierzu einen Spezialisten zu kontaktieren. (z.B: Datenschutzbeauftragte, Rechtsabteilung)

Mehrsprachigkeit

Verfügt die Website über mehrere Sprachen oder wird eine neue Sprache angelegt, werden die Inhalte der Startsprache automatisch übertragen und können nachher angepasst werden. Einige Felder wie Schlüssel, Scripte, Domain und Cookie-Auswahl können nur in der Startsprache geändert werden. Die Änderungen werden automatisch auf alle weiteren Sprachen übertragen.

Screenshot

Das AddOn liefert bereits eine Auswahl Themes mit, die im Reiter nur ausgewählt und aktiviert werden müssen.

Um ein eigenes Theme zu erstellen, empfiehlt es sich, ein bestehendes Theme zu kopieren und im Verzeichnis /project/consent_manager_themes/ des Projekt-AddOns abzulegen. Der neue Dateiname sollte der Schreibweise consent_manager_frontend_theme*.scss entsprechen.

z.B: /project/consent_manager_themes/consent_manager_frontend_theme_mein_theme.scss

Anschließend können die gewünschten Anpassungen vorgenommen werden und das neue Theme kann unter "Themes" in der Theme-Vorschau ausgewählt werden.

Gerne können eigene Themes auch als PR eingereicht werden 😀. Bitte mit Screenshot oder Demo-Link.

Tipp:

Zum Testen und Entwickeln des eigenen Themes (im Ordner /project/consent_manager_themes/) kann man die Vorschau auch direkt aufrufen:

z.B:

/redaxo/index.php?page=consent_manager/theme&preview=project:consent_manager_frontend_mein_theme.scss

Einfach mit der rechten Maustaste auf den Button Theme Vorschau klicken und Link in neuem Fenster öffnen.

Individuelles Design

Reicht die Lösung über ein Theme nicht, kann die Box auch vollständig individualisert werden. Der HTML-Code der Cookie Box liegt im Fragment /redaxo/src/addons/consent_manager/fragments/consent_manager_box.php. Änderungen in dieser Datei werden beim nächsten Update überschrieben. Deshalb ist es empfehlenswert, das Fragment zu kopieren und zum Beispiel im Project oder Theme AddOn abzulegen 'theme/private/fragments/consent_manager_box.php' und die Änderungen hier vorzunehmen. Das eigene CSS stellt man entweder über ein Theme scss bereit oder individuell im Template als eigene CSS-Datei.

Ausgabe-Einstellungen

Über den Menüpunkt Einstellungen kann die Ausgabe für CSS und JavaScript im Frontend gesteuert werden. Standardmäßig wird auf jeder Seite das benötigte JavaScript und die CSS-Datei consent_manager_frontend.css ausgegeben.

Der Platzhalter REX_CONSENT_MANAGER[] im Template wird durch folgenden Code ersetzt.

<style><style>/*consent_manager_frontend.css*/ @keyframes fadeIn{0%{opacity:0}100%{opacity:1}}</style>
<script src="./index.php?consent_manager_outputjs=1&lang=1&a=6&i=false&h=false&cid=43&v=4&r=0&t=16732118931" id="consent_manager_script" defer></script>

Sind im eigenen Frontend-Theme Styles für die Consent-Box vorhanden kann hier die Ausgabe der CSS-Datei consent_manager_frontend.css durch aktivieren der Einstellung Eigenes CSS verwenden unterdrückt werden. Es wird dann nur die JavaScript-Zeile ausgegeben.

Gesetzte Cookies / Einwilligungshistorie

Mit Hilfe des Platzhalters REX_COOKIEDB[] können alle derzeit gesetzten Cookies sowie die Einwilligungshistorie z.B. in der Datenschutzerklärung ausgegeben werden.

Wichtig: Der Platzhalter funktioniert ausschließlich in REDAXO-Templates, nicht innerhalb von php-includes, Modulen oder Fragmenten.

Tipps & Tricks

Hast du eigene Tipps & Tricks? Füge Sie auf Github direkt in die Readme hinzu oder lege ein Issue an.

Soll der Nutzer die Möglichkeit bekommen, seine Einstellungen nachträglich anzupassen (zum Beispiel im Impressum oder auf einer Cookie-Seite) ist das mit folgenden Links möglich:

<a class="consent_manager-show-box">Datenschutz-Einstellungen</a>

öffnet die Cookie-Box und erzwingt einen Page-Reload nach der Einwilligung.

<a class="consent_manager-show-box-reload">Datenschutz-Einstellungen</a>

Aufruf per Javascript

Die Cookie-Box kann auch durch einen JavaScript-Aufruf geöffnet werden consent_manager_showBox().

// Achtung hier mit Unterstrichen da sonst der Beispiel-Code verstümmelt wird.
// Unterstriche bei `on_click` und `java_script` müssen entfernt werden!
<button on_click="java_script:consent_manager_showBox();">Datenschutz-Einstellungen</button>

Um mit JavaScript einen Consent abzufragen die Funktion consent_manager_hasconsent() verwenden.

<script>
window.addEventListener('load', (event) => {
    if (true === consent_manager_hasconsent('youtube')) {
        alert('youtube Ok');
    }
});
</script>

Um mit PHP einen Consent abzufragen die Klassen-Funktion consent_manager_util::has_consent() verwenden.

<?php
if (true === consent_manager_util::has_consent('youtube')) {
    echo('youtube Ok');
}
?>

Um z.B. einen Link zu teilen bei dem keine Consent-Box erscheinen soll kann in den Einstellungen ein TOKEN hinterlegt werden. An die URL dann einfach skip_consent=MEINTOKEN anhängen.

z.B.: https://meinedomain.de/SeiteOhneToken.html?skip_consent=MEINTOKEN

Scripte per PHP laden

Neben der Einbindung der Scripte direkt über das Addon lassen sich Scripte auch per PHP einbinden. Somit kann man (am Beispiel GoogleMaps) eine Meldung ausgeben, dass bestimmte Cookies akzeptiert werden müssen um die Karte zu laden. Problem dabei: öffnet man die Cookie-Box und akzeptiert die Cookies, wird zwar das Script geladen, aber ohne Page-Reload ändert sich der Inhalt der Seite nicht. Deshalb sollte man hier den Link: <a class="consent_manager-show-box-reload">Cookie Einstellungen bearbeiten</a> verwenden.

$arr = json_decode($_COOKIE['consent_manager'], true);
$check = [];
if ($arr)
{
$check = array_flip($arr['consents']);
}
#dump($arr);
if ($check['google-maps']) {
  // Code Ausgabe bei akzeptierter CookieGruppe
  // GoogleMaps-Code
} else {
  // Code Ausgabe bei abgelehnter CookieGruppe
  // Warnhinweis + <a class="consent_manager-show-box-reload">Cookie Einstellungen bearbeiten</a>
}

Berechtigung für Redakteure

Um die Cookie-Texte auch für Redakteure zur Änderung bereitzustellen muss diesen das Recht consent_manager[] und zusätzlich das Recht consent_manager[texteditonly] zugewiesen werden. Die Redakteure können dann nur die Cookie-Texte ändern, alle anderen Funktionen werden ausgeblendet.

Fehlerbehebung

  • Ist eine Domain hinterlegt und in der Cookie-Gruppe zugeordnet? - Bei mehreren Domains sind die Gruppen für jede Domain einzeln anzulegen.
  • Stimmt die zugeordnete Domain mit der aufgerufenen Domain überein? - www.meinedomain.de und meinedomain.de sind zwei verschiedene Domains.
  • Ist die Website über die zugeordnete Domain (www.meinedomain.tld) erreichbar? - Unterordner Installationen funktionieren nicht.
  • Sind der Platzhalter REX_CONSENT_MANAGER[] oder der PHP-Code in einem Template im head-Bereich hinterlegt? .
  • Unter Einstellungen ist Eigenes CSS verwenden aktiviert aber es wird kein eigenes CSS eingebunden (HTML der Box wird am Seitenende angezeigt und nicht als Popup)
  • Ist der Startkartikel der Seite auch als Not Found Artikel (404) konfiguriert? - Die Cookie-Box wird beim 404 Artikel nicht ausgegeben
  • Ist eine entsprechende Cookie-Gruppe angelegt?
  • Wurde Dienst in der entsprechenden Gruppe aktiviert?
  • Sind die Scripte in der entsprechenden Cookies hinterlegt?
  • Sind die Scripte inklusive <script>...</script>-Tag hinterlegt?

Fehler melden

Du hast einen Fehler gefunden oder wünscht dir ein Feature? Lege ein Issue auf Github an.

Lizenz, Autor, Credits, Sponsoren

Lizenz

MIT Lizenz, siehe LICENSE.md cookie.js: MIT Lizenz

Autor

Friends Of REDAXO https://github.com/FriendsOfREDAXO

Projekt-Leads Ingo Winter, Andreas Eberhard

Credits

Contributors:

First Release: Ingo Winter.

Sponoren:

Thomas Blum wird eine Menge Code aus seinem Sprog Addon in Consent-Manager wiederfinden. Thomas Skerbis hat unermüdlich getestet und für die Entwicklung gespendet, Peter Bickel hat für die Entwicklung gespendet, Oliver Kreischer hat den Keks gebacken.

Open Source Agenda is not affiliated with "FriendsOfREDAXO Consent Manager" Project. README Source: FriendsOfREDAXO/consent_manager
Stars
56
Open Issues
20
Last Commit
2 weeks ago
Repository
FriendsOfREDAXO/consent_manager
License
MIT
Tags
Cookie Cookie Consent Redaxo Redaxo Addon Hacktoberfest Addon Consent Management Cookie Hinweis Datenschutz Dsgvo Dsgvokonform Consent

Open Source Agenda Badge

Open Source Agenda Rating
Submit Review Review Your Favorite Project
Submit Resource Articles, Courses, Videos
Submit Article Submit a post to our blog

From the blog

Dec 11, 2022

How to Choose Which Programming Language to Learn First?

From the blog

Dec 11, 2022

How to Choose Which Programming Language to Learn First?