[3.3] [CDB][3.3] Opt-In Cookie Manager by klaro Script

[chris1278]

Name der Extension: Opt-In Cookie Manager by klaro Script

Autor: Chris1278
CO-Autor: Kirk
Mitwirkender: 69bruno

Version der Extension: 2.0.3

Voraussetzungen:

• phpbb 3.2.10 aufwärts

• php 7.0/7.1/7.2/7.3/7.4

Beschreibung der Extension

Diese Extension blendet bei Aufruf der Seite eine Box ein wo man Cookies einstellen kann. Dies geschieht mittels dem Kostenlosen Script von Klaro

Wichtiger Hinweis

Es kommt kurioser Weise vor das der YouTube bbcode nicht korrekt geupdatet wird. Daher hier die Erläuterung zum Manuellen Update.

Geht auf das ACP unter der Rubrik "Beiträge". Dort sind die BBcodes aufgelistet. sucht den Youtube bbcode und klickt auf das grüne rädchen um diesen zu editieren.

Dieser muss dann wie folgt aussehen:

BBCode-Benutzung

Code: Alles auswählen

[youtube]https://{IDENTIFIER2}.youtube.com/watch?v={IDENTIFIER}[/youtube]

HTML-Ersetzung

Code: Alles auswählen

<div class="videoLayer"><div class="videoLayer-inner"><iframe data-src="https://{IDENTIFIER2}.youtube-nocookie.com/embed/{IDENTIFIER} "data-name="youtube"?rel=0&showinfo=0&autoplay=0" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div></div>

Tipp-Anzeige

Code: Alles auswählen

YT_VIDEOLINK_HELP

Anschließend einfach auf Absenden klicken. Danach sollten die eingebunden Videos wieder funktionieren.

Download:

Download aus der Extension Datenbank bei phpbb.com Opt-In Cookie Manager

Historie

Version 2.0.3

• Umbau der Acp Module und hinzufügen einiger Optionen und Schalter

• Das Modul für die Allgemeinen Einstellungen wurde in Zwei Bereiche unterteilt. Der erste Bereich bezieht sich überwiegend auf die Otischen Einstellungen die im Großteil nur optisches Verhalten beeinflussen und bei nicht gefallen entsprechend angepasst werden kann. Der zweite Teil enthält etwas unfänglichere Angaben die man mit bedacht auswählen sollte.

• Hinzugefügte Optionen um Bereich Allgemeine Einstellungen:
  • Hinzufügen der Option: Breite des Cookie Fensters
  • Hinzufügen der Option: Anzeigeposition des schmalen Cookie Fensters

• Das Modul für die Schalter wurde auch erweitert und man hat dort mehr Auswahlmöglichkeiten

• Anmerkung: Ich habe für jemanden ein Forum mit Hilfe seines Rechtsanwaltes soweit ich es Umsetzen Konnte DSGVO Konform gemacht. Der Rechtsanwalt hat dann auch die Art und Informationen die mein Cookie Manager ausgeben geprüft und Änderungen genannt die ich dann auch so gut es ging umgesetzt habe. Daher hat sich die Anzeige der Cookies selber auch mit weiteren Informationen vergrößert. Natürlich gibt es bestimmt den ein oder anderen Anwalt dem dies zu viel oder zu wenig ist. Da ich persönlich diese Informationen und die Optik auch für gut finde habe ich diese auch übernommen. Ich bin aber kein Anwalt daher ist was DSGVO betrifft jeder selber verantwortlich. Für die Optik der neuen Box könnt Ihr euch auf phpbb.com die Bilder ansehen. ich habe mal zwei Bilder von der neuen Version mit der neuen Optik dort gepostet

• Hinzugefügt die Auswahl des Impressums welches man in der Cookie Box anzeigen lassen möchte. Dies wurde einführt nach dem ich für einen User das Forum mit Hilfe seines Rechtsanwaltes wegen einer Abmahnung auf Grundlage der DSGVO nachgebessert habe. Dieser Schalter ermöglicht es bei den Informationen der essentiellen Cookies auf das Impressum zu verlinken. (Wird empfohlen sofern Impressum Vorhanden ist. Dies kann entweder ein Link zu einem Impressum sein oder die Extension about us von Crizzo)

• Die Schalter sind aktuell in drei Kategorien einteilt:

• • Media-BBcodes
    • Wie der Name sagt sind das BBcodes die über die Cookie Box gesteuert werden
  • Schalter mit integrierten Skripten
    • Diese Schalter sind mit Skripten schon in der Extension integriert
  • Schalter ohne integrierte Skripte
    • Diese Schalter sind da aber die Skripte müssen noch manuell in eine html Datei eingefügt werden

• Hinzugefügte Schalter:
  • Google Webfont
  • Advertisement Management Extension (Google AdSense)
  • Advertisement Management Extension (Google AdSense)

Version 2.0.2

• Geändert wurde das die fontawesome 5 Schriftart Dateien nicht mehr über Github geladen werden sondern die 4 Dateien jetzt direkt aus der Extension geladen werden.

Version 2.0.1

• Hinzugefügte Schalter für:
  • Vimeo Video Bbcode
  • Spotify Video Bbcode
  • Matomo Analytcs

• Andere Aufteilung der Optionen Im Schalter Auswahlmenu.

• Korrigierte Aufteilung im Auswahlfeld des Forenbesuchers. Also etwas optimierte aufteilung

• Diverse Codeanpassungen

Version 2.0.0

• Hinzugefügt funktion Helle oder Dunkle Optik

• Komplette Umstellung auf controller Basis

Version 1.0.4

• Hinzufügen Google Analytcs ohne Tagmanager

• Diverse Codanpassungen

• Version Wurde auf shortarray umgestellt daher anhebung der mindestvorraussetzung.

Version 1.0.2

• Hinzufügen einer Versionsprüfung

• Korrektur des YouTube bbcodes

• Hinzufügen der Verlinkung zur Datenschutzerklärung und den Nutzungsbedingungen des Forums

• Einige Optische Farbanpassungen

• Die Textmeldungen in den Cookie Feldern jetzt über die Sprachdateien der Extension eingefügt. Was ermöglicht die Boxen in der Sprache anzuzeigen, die der Benutzer im Forum für sich eingestellt hat. Dies ermöglicht durch Variable Übergabe an das Javascript. Womit die Datei config.js nicht zu aufgebläht wird, in dem man dort für jede Sprache sonst einen eigenen Block zufügen muss. Und auch wird durch diese Variante die Anpassung der anzuzeigenden Texte vereinfacht da man nur, die entsprechenden Sprach-Variablen aus den jeweiligen Sprachdateien anpassen muss. Das die Sprachvariablen in die Sprachdateien ausgelagert werden konnte ist 69bruno zu verdanken.

Version 1.0.1

• Mit dieser Version wird der Youtube BBcode automatisch erstellt (besten dank an Kirk )

• Den Text in der Box etwas geändert.

Version 1.0.0

• Erstellung der Extension

Bitte erste Disskusionen in diesem Thema hier

[chris1278]

Es gibt von dieser Erweiterung ein Update. Es wird jetzt der YouTube bbcode direkt hinzugefügt und falls vorhanden wird dieser upgedatet.

Des Weiteren ist der Text in der Box etwas geändert worden, da man mir angetragen hat auf begriffe wie müssen zu verzichten.

Es wurde mir gesagt das, wenn ich in der Opt-in Variante Begriffe nutze wie „müssen“ wäre ich dann rechtlich dafür haftbar. Da ich aber kein Anwalt bin und ich keinen Stress bekommen will habe ich den Text jetzt etwas umformuliert. Jeder kann in der Datei config.js den Text gern seinen eigenen Wünschen anpassen dies steht jedem Frei.

[migoe]

Hallo chris1278,

Es gibt von dieser Erweiterung ein Update. Es wird jetzt der YouTube bbcode direkt hinzugefügt und falls vorhanden wird dieser upgedatet.

danke für das Update. Dazu hätte ich die Frage, ob sich der Einbettungscode für YouTube inhaltlich geändert hat oder er nur automatisch genau so wie Du ihn bereits gepostet hattest eingetragen wird?

Wenn Du etwas daran geändert hat, dann würde mich interessieren, ob die Größe des Videofensters größer oder zumindest responsiv geworden ist, denn das fände ich gut. Im Moment (Version 1.0.0) sieht das Videofensters so aus bei mir
[ externes Bild ]
da wird also noch ziemlich viel Platz frei gelassen links vom Video...

Jeder kann in der Datei config.js den Text gern seinen eigenen Wünschen anpassen dies steht jedem Frei.

Ich habe bei mir die Texte und die Boxen auch schon angepasst
[ externes Bild ]
[ externes Bild ]
und würde deshalb gerne wissen, ob innerhalb der .js-Dateien etwas geändert wurde außer den Texten?

Wenn es grundsätzlich möglich wäre die Texte in den Java Dateien durch Variablen in den Sprachdateien der Erweiterung zu ersetzen, dann würde ich mir zutrauen, Dir hier zu helfen. Allerdings konnte ich leider nur anbieten Dir quasi "Fleißarbeit" abzunehmen, diese Texte in vorher festgelegte Variablen zu übertragen, denn ich weiß leider nicht, wie der Code in den Dateien dafür angepasst werden müsste.

Ich meine z.B. solche Sachen (Beispiel aus der config.js):

consentNotice: {
description: "Wir setzen auf unserer Webseite (technisch notwendige) und externe Cookies ein. Sag uns, welche Cookies Du erlauben willst. Wenn Du auf <b>[Ablehnen]</b> klickst, werden nur die technisch notwendigen Cookies gesetzt: <br><br>{purposes}. <br><br>Diese Einstellungen können später zu jedem Zeitpunkt geändert werden. Welche Cookies wir setzen erklären wir in unserer <a href='https://www.liedermacher-forum.de/ucp.p ... klärung</a>. Eine Erklärung zur Handhabung der Cookie-Einstellungen haben wir im <a href='https://www.liedermacher-forum.de/viewt ... 499'>Forum für technische Fragen</a> gegeben.<br><br>",
learnMore: "Zu den Cookie-Einstellungen",
},

könnten ja vielleicht ersetzt werden durch Platzhalter für Sprachvariablen wie z.B.

consentNotice: {
description: "{L_DESCRIPTION_COOKIE}",
learnMore: "{L_LEARNMORE_COOKIE}",
},

Der Vorteil wäre, dass zukünftige Änderungen an den Texten unabhängig von den anderen Änderungen an Code gemacht werden können und dadurch vor allem Laien weniger Probleme bei der Anpassung hätten - und weniger Fehler auftreten würden, weil z.B. bei einer Änderung ein Satzzeichen falsch oder gar nicht gesetzt wird...

[chris1278]

Hallo chris1278,

Es gibt von dieser Erweiterung ein Update. Es wird jetzt der YouTube bbcode direkt hinzugefügt und falls vorhanden wird dieser upgedatet.

danke für das Update. Dazu hätte ich die Frage, ob sich der Einbettungscode für YouTube inhaltlich geändert hat oder er nur automatisch genau so wie Du ihn bereits gepostet hattest eingetragen wird?

Wenn Du etwas daran geändert hat, dann würde mich interessieren, ob die Größe des Videofensters größer oder zumindest responsiv geworden ist, denn das fände ich gut. Im Moment (Version 1.0.0) sieht das Videofensters so aus bei mir
[ externes Bild ]
da wird also noch ziemlich viel Platz frei gelassen links vom Video...

Leider habe ich weder im bbcode selber noch im zugehöhrigem script einen grössenaangabe gefunden. Daher kann ich leider nicht sagen woher es seine Grösse bezieht.

Jeder kann in der Datei config.js den Text gern seinen eigenen Wünschen anpassen dies steht jedem Frei.

Ich habe bei mir die Texte und die Boxen auch schon angepasst
[ externes Bild ]
[ externes Bild ]
und würde deshalb gerne wissen, ob innerhalb der .js-Dateien etwas geändert wurde außer den Texten?

Wenn es grundsätzlich möglich wäre die Texte in den Java Dateien durch Variablen in den Sprachdateien der Erweiterung zu ersetzen, dann würde ich mir zutrauen, Dir hier zu helfen. Allerdings konnte ich leider nur anbieten Dir quasi "Fleißarbeit" abzunehmen, diese Texte in vorher festgelegte Variablen zu übertragen, denn ich weiß leider nicht, wie der Code in den Dateien dafür angepasst werden müsste.

Ich meine z.B. solche Sachen (Beispiel aus der config.js):

consentNotice: {
description: "Wir setzen auf unserer Webseite (technisch notwendige) und externe Cookies ein. Sag uns, welche Cookies Du erlauben willst. Wenn Du auf <b>[Ablehnen]</b> klickst, werden nur die technisch notwendigen Cookies gesetzt: <br><br>{purposes}. <br><br>Diese Einstellungen können später zu jedem Zeitpunkt geändert werden. Welche Cookies wir setzen erklären wir in unserer <a href='https://www.liedermacher-forum.de/ucp.p ... klärung</a>. Eine Erklärung zur Handhabung der Cookie-Einstellungen haben wir im <a href='https://www.liedermacher-forum.de/viewt ... 499'>Forum für technische Fragen</a> gegeben.<br><br>",
learnMore: "Zu den Cookie-Einstellungen",
},

könnten ja vielleicht ersetzt werden durch Platzhalter für Sprachvariablen wie z.B.

consentNotice: {
description: "{L_DESCRIPTION_COOKIE}",
learnMore: "{L_LEARNMORE_COOKIE}",
},

Der Vorteil wäre, dass zukünftige Änderungen an den Texten unabhängig von den anderen Änderungen an Code gemacht werden können und dadurch vor allem Laien weniger Probleme bei der Anpassung hätten - und weniger Fehler auftreten würden, weil z.B. bei einer Änderung ein Satzzeichen falsch oder gar nicht gesetzt wird...

Wenn das so einfach wäre. Leider habe ich bis jetzt noch keine Möglichkeit gefunden wie ich eine Sprach variable geschweige denn eine andere Variable von phpbb in diesem Script nutzen kann. Weil ich daran auch bezüglich der Datenschutzerklärung gedacht habe. Daher müsste man den Link immer selber eintragen. Wenn man dort in der Config.js variablen wie {{BOARD_URL}} oder ähnliches benutzen könnte (Dies betrifft auch Sprach Variablen da diese genauso einzusetzen sind) Würde ich auch in der Box schon auf die Foreneigene Datenschutzerklärung verlinken. Daher ja der Hinweis auf die Datenschutzerklärung bzw. Nutzungsbedingungen im Footer des Forums.

Ansonsten hat sich nicht viel verändert der youtube bbcode ist derselbe wie den den man manuell einfügen mus.

[migoe]

Hallo chris1278,

Leider habe ich weder im bbcode selber noch im zugehöhrigem script einen grössenaangabe gefunden. Daher kann ich leider nicht sagen woher es seine Grösse bezieht.

dafür habe ich jetzt eine Lösung gefunden, die bei mir gut funktioniert. Dazu müsste der HTML-Code des YouTube-BBCodes von Dir so geändert werden:

Code: Alles auswählen

<!-- Container von migoe eingefügt -->
<div class="video-container">
<!-- migoe Ende -->
  <div class="videoCConsentContainer" data-source="{IDENTIFIER}">
   <div class="ccMessageContainer embed-responsive embed-responsive-16by9">
    <div class="msgMedienContent">
    <p>Link zum Video: <a href="https://{IDENTIFIER2}.youtube.com/watch?v={IDENTIFIER}">https://{IDENTIFIER2}.youtube.com/watch?v={IDENTIFIER}</a><br><br>{L_COOKIE_INFO}</p>
    <a class="btn btn-primary" onclick="return klaro.show();">Cookie-Consent-Einstellungen anpassen</a>
    </div>
   </div>
   <div class="videoLayer embed-responsive embed-responsive-16by9 vimvid"></div>
  </div>
<!-- Abschluss Container migoe -->
</div>
<!-- migoe Ende -->

Ich habe hier einen zusätzllichen div-Container eingebaut = 1.Zeile + Letzte Zeile und damit dieser Container responsiv reagiert und das Videofenster damit auf die größtmögliche Größe skaliert wird, muss noch folgendes in die common.css des verwendeten Styles eingebaut werden:

Code: Alles auswählen

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

Quelle für diese CSS-Änderung = Webseite von Martina Honecker

Nach den Änderungen nicht vergessen: Foren-Cache und Browser-Cache aktualisieren bzw. löschen!

Auf meinem Forum kann man sich das anschauen...

[chris1278]

Ok werde das testen. Wenn das funktioniert kann man das alles so in die Extension einbauen.

@edit

So ich habe deine Änderung jetzt so übernommen. Wer die aktuelle Version meiner Extension hat, macht Folgendes:

Im ACP unter dem Reiter Beiträge die bbcodes öffnen.

Dort den youtube bbcode finden und auf das Grüne Zahnrad klicken um diesen zu bearbeiten.

Den inhalt in der Box "html-Ersetzug" mit folgendem ersetzen:

Code: Alles auswählen

<div class="video-container">
<div class="videoCConsentContainer" data-source="{IDENTIFIER}">
<div class="ccMessageContainer embed-responsive embed-responsive-16by9">
<div class="msgMedienContent">
<p>Link zum Video: <a href="https://{IDENTIFIER2}.youtube.com/watch?v={IDENTIFIER}">https://{IDENTIFIER2}.youtube.com/watch?v={IDENTIFIER}</a><br><br>{L_COOKIE_INFO}</p>
<a class="btn btn-primary" onclick="return klaro.show();">{L_ADJUST_COOKIE}</a>
</div>
</div>
<div class="videoLayer embed-responsive embed-responsive-16by9 vimvid"></div>
</div>
</div>

Öffnen der Datei /ext/chris1278/styles/all/theme/cookie.css

dort am ende folgendes Einfügen:

Code: Alles auswählen

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

Danach Foren und Browser Cache leeren.

[chris1278]

Es gibt eine neue Version der Erweiterung.

Wichtig!!!

Die Alte Version Komplett löschen und Arbeitsdaten auch Löschen. Dann unter Beiträge denn BBcode youtube löschen.

Dann auf dem Server das komplette Verzeichnis austauschen und wieder installieren!

[sepp71]

Als mit Javscript etc. eher nicht vertrauter Benutzer versuche ich immer noch, mit dem klaro-Skript eine Umschaltung zwischen Google Adsense a.) personalisiert und b.)unpersonalisiert über die entsprechenden Cookies abzufragen und umzusetzen.
Unpersonalisiert würde ich dabei als Maßnahme des berechtigten Interesses unter "essentiell" betrachten. Für Personalisiert wäre dann "adsense =true" angedacht.
Dabei würde es mir reichen, wenn jedenfalls ab der zweiten aufgerufenen Seite die Werbung (falls erlaubt) personalisiert würde.
Hat das von Euch schon jemand hinbekommen? Ich bekomme die Anleitungen von klaro einerseits und Google andererseits nicht übereinander...

Mein Stand:
klaro config.js:

Code: Alles auswählen

  name: 'googleadsense',
            default: false,
            title: 'Google Adsense',
            purposes: ['advertising'],
            cookies: [],
            required: false,
            optOut: false,

Wenn ich mein so erzeugtes Cookie (mit zwei weiteren Einstellungen) nach dem Zustimmen in der Browser-Konsole auslese, lautet es:

Code: Alles auswählen

%7B%22essentials%22%3Atrue%2C%22anderercookie%22%3Atrue%2C%22googleadsense%22%3Atrue%7D

(auslesen per Javascript beherrsche ich nicht).
overall_header.html:

Code: Alles auswählen

<script type="text/plain" data-ad-client="ca-pub-XXXXX" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" data-type="application/javascript" data-name="googleadsense"></script>

Anzeigencode in Advertisement Management:

Code: Alles auswählen

<p class="topiclist">Anzeige:</p>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:inline-block;width:336px;height:280px"
     data-ad-client="ca-pub-8274951737834361"
     data-ad-slot="1651355006"></ins>
</script>

Damit geht aber nur Anzeige ein ODER Anzeige aus. Die dritte Option (Anzeige personalisiert) fehlt mir.
Ich stehe hier auf dem Schlauch...

Hat von Euch jemand einen Tipp?
Sepp

[chris1278]

Was JavaScript angeht kann ich mich nicht zu äußern da ich mich damit nicht auskenne.

[sepp71]

Ich habe noch weiter in der Konsole gesucht und diese Fehlermeldung gefunden:
"AdSense head tag doesn't support data-type attribute."
Das klingt für mich nach einem Deal-Breaker, jedenfalls was den Wechsel zwischen personalisierten und unpersonalisierten Anzeigen angeht?