Seite 1 von 1

CSS Cookie-Hinweis

Verfasst: So 22. Okt 2023, 08:39
von Goldschwalbe
Moin Zusammen
Ich möchte den Cookie-Hinweis CSS-mäßig (dislay-7 -> display-4 und der Button) bearbeiten. Hat jemand eine Idee, wo man das macht?
Manuell habe es gemacht - aber das ist ja nicht Sinn der Sache.

Code: Alles auswählen

<div id="cookie-dialog" style="display: none;"><div id="cookiesdirective" style="background-color:rgba(253,249,233,1)"><div style="position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgb(0, 0, 0); opacity: 0; z-index: 9999;"></div><div style="position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; z-index: 10000"><div class="cookie-wrapper" style="font-family: sans-serif;position: relative; width: 100%; max-width: 500px; margin-right: auto; margin-left: auto; padding: 1rem; text-align: center; border-radius: .3rem; box-shadow: 0 10px 40px 0 rgba(0,0,0,0.2); color:#17003b; background:rgb(253, 249, 233);"><div class="mbr-text"><p class="display-4 accept-text">Wir nutzen Cookies, um Ihnen die Funktionalität der Buchung zu gewährleisten. Sie erklären sich mit der Verwendung von Cookies bei Benutzung der Homepage einverstanden. Hier unsere <a style='color: #232323; text-decoration: underline;' href='datenschutz.php'>Datenschutz-Bestimmungen</a>.</p></div><div class="mbr-section-btn"><a class="btn btn-sm" style="margin:0; background-color:#00993f!important;color:#FFFFFF!important" id="impliedsubmit">OK</a></div></div></div></div></div>
  <input name="cookieData" type="hidden" data-cookie-cookiesAlertType='1' data-cookie-customDialogSelector='#cookie-dialog' data-cookie-colorText='#17003b' data-cookie-colorBg='rgb(253, 249, 233)' data-cookie-opacityOverlay='0' data-cookie-bgOpacity='100' data-cookie-textButton='OK' data-cookie-rejectText='nicht ok' data-cookie-colorButton='#00993f' data-cookie-rejectColor='#ffffff' data-cookie-colorLink='#232323' data-cookie-underlineLink='true' data-cookie-text="Wir nutzen Cookies, um Ihnen die Funktionalität der Buchung zu gewährleisten. Sie erklären sich mit der Verwendung von Cookies bei Benutzung der Homepage einverstanden. Hier unsere <a href='datenschutz.php'>Datenschutz-Bestimmungen</a>.">
    <input name="animation" type="hidden">
  

Re: CSS Cookie-Hinweis

Verfasst: So 22. Okt 2023, 10:22
von Tommy Herrmann
Moin,

wo hast Du das denn gemacht - manuell im Nachhinein in der HTML-Datei? Dann wird es ja mit jeder Änderung der Seite wieder überschrieben :eek:

... also, da ich den "Cookie Alert" von Mobirise eigentlich gar nicht verwende (ich verwende das Consent-Tool "CookieFirst"), habe ich mich damit jetzt auch nicht intensiv beschäftigt.

Du hast da aber vollkommen recht - Mobirise generiert diese Style-Einstellungen, die Du ja direkt im Editor vom "Cookie Alert" vornehmen kannst, direkt an das Element mit dran - also ohne CSS-Datei.

Das wird dann alles über die JavaScript-Datei "cookies-alert-script.js" erledigt, die Du sicherlich weder ändern willst noch ändern solltest.

Also - nein - es sind ansonsten in Mobirise keine weiteren Möglichkeiten vorgesehen das anzupassen.

Im Editor kannst Du ja per Auswahl-Werkzeug sowieso schon folgende Inhalte ändern:

1) Text Color (Textfarbe)
2) Background Color (Hintergrundfarbe)
3) Accept Color (Akzeptierenfarbe - vom Button)
4) Link Color (Linkfarbe)
5) Background Opacity (Hintergrund-Deckkraft)

Weiterhin kannst Du ja direkt im Cookie-Editor den Text mit HTML editieren, also alle bekannten Tags dort anwenden, wie eben Links oder z.B. <span> Tags zum Stylen der Schrift verwenden, wie z.B.:

Code: Alles auswählen

Indem Sie akzeptieren, stimmen Sie unseren 
<a href='https://www.mobirise-tutorials.com/Datenschutz/' target='_blank'>Datenschutzbestimmungen</a> 
<span style='color: red;'>in vollem Umfang</span> zu.<br>
Um Ihre Zustimmung zu widerrufen, können sie die Cookies vom verwendeten Browser löschen.
Achte dabei darauf einfache Hochstriche ' zu verwenden, da dieser gesamte Inhalt als String außen mit doppelten Hochstrichen " von Mobirise generiert wird.

Eigentlich ist doch damit auch alles abgedeckt, was sollte man noch ändern wollen?!

Siehe mein Beispiel im Screenshot:


Cookie-Alert.jpg

Re: CSS Cookie-Hinweis

Verfasst: Mo 23. Okt 2023, 10:18
von Goldschwalbe
Danke Tommy für Deine Antwort.
Ich wollte z.B. die CSS-Klasse "display-7" in "display-4" ändern.

Folgenden Text habe ich:
Wir nutzen Cookies, um Ihnen die Funktionalität der Buchung zu gewährleisten. Sie erklären sich mit der Verwendung von Cookies bei Benutzung der Homepage einverstanden. Hier unsere <a href='datenschutz.php'>Datenschutz-Bestimmungen</a>.
Mobirise wandelt das ja in:

Code: Alles auswählen

<div class="mbr-text"><p class="display-7 accept-text">Wir nutzen Cookies, um Ihnen die Funktionalität der Buchung zu gewährleisten. Sie erklären sich mit der Verwendung von Cookies bei Benutzung der Homepage einverstanden. Hier unsere <a style='color: #232323; text-decoration: underline;' href='datenschutz.php'>Datenschutz-Bestimmungen</a>.</p></div>
um.
Ich möchte aber jetzt die Klasse "display-4" nutzen (und nicht 7).
Könnte man das jetzt so ändern?
<span class="display-4">Wir nutzen Cookies, um Ihnen die Funktionalität der Buchung zu gewährleisten. Sie erklären sich mit der Verwendung von Cookies bei Benutzung der Homepage einverstanden. Hier unsere <a href='datenschutz.php'>Datenschutz-Bestimmungen</a>.</span>

Re: CSS Cookie-Hinweis

Verfasst: Mo 23. Okt 2023, 10:38
von Goldschwalbe
Ich habe es mal probiert.
Den Text habe ich mit einem SPAN-Tag versehen und dann die Klasse "display-4" genommen:
Also im Prinzip so:
<span class="display-4"> ..... </span>

Und es hat funktioniert.

Jetzt muss ich noch eine Klasse für den Button eleminieren. Das wird schwieriger ...

Re: CSS Cookie-Hinweis

Verfasst: Mo 23. Okt 2023, 10:44
von Goldschwalbe
Es geht um Folgendes:

<a class="btn btn-sm btn-primary" ...
Ich brauche den Link jetzt ohne Klasse "btn-primary".

Re: CSS Cookie-Hinweis

Verfasst: Mo 23. Okt 2023, 10:52
von Goldschwalbe
Konkret geht es um den Hover-Effekt.

Re: CSS Cookie-Hinweis

Verfasst: Mo 23. Okt 2023, 11:29
von Tommy Herrmann
Moin,

ich befürchte, da kann ich Dir auch nicht helfen.

Mobirise schreibt ja über das JavaScript da alles direkt an das Element als Style-Anweisung mit !important dran. Alles, was man nun versucht über eine CSS-Class zu gestalten, kommt ja dann am Element gar nicht an.

Wahrscheinlich gibt es irgendeine Möglichkeit - die ist mir aber gerade nicht bewusst.

Sonst schreibe doch mal an den Mobirise-Support, dass Du für den "Consent-Button" im Cookie-Alert einen Hover-Effekt haben möchtest und wie Du das machen könntest.

support@mobirise.com

Re: CSS Cookie-Hinweis

Verfasst: Di 24. Okt 2023, 14:33
von Goldschwalbe
Danke Tommy.

Re: CSS Cookie-Hinweis

Verfasst: Di 24. Okt 2023, 17:27
von Goldschwalbe
Tommy
Ich bin auf die CookieFirst-Seite gegangen.
Ist das Tool kostenpflichtig?

Re: CSS Cookie-Hinweis

Verfasst: Di 24. Okt 2023, 19:33
von Tommy Herrmann
ja - das kostet was. Ich habe den "Basic" Tarif für 9,00 pro Monat.

https://cookiefirst.com/de/#pricing

... ist auch nicht etwa alles "automatisch". Das muss man auch recht aufwändig erlernen und muss fast alle Sachen einzeln sperren.

"CookieFirst" hat allerdings einen hervorragenden Support, der einem immer und gerne hilft.

Keine Ahnung, ob Du das wirklich gerade benötigst, zumal es ja nun ein neues Datenschutzabkommen zwischen den USA und der EU gibt.

https://germany.representation.ec.europ ... 3-07-10_de