Usercentrics eTrusted – Consent-Manager “Verweigern” Button frei gestalten – So geht es richtig

Wer den Consent-Manager von eTrusted.com benutzt und z.B. den Ablehnen-Button farblich verändern möchte, wird feststellen, dass dies nicht über die Einstellungen möglich ist. Nach einer kurzen Recherche findet man zwar eine Anleitung, nur leider funktioniert diese nicht.

So funktioniert es

Es ist nötig, ein kleines JavaScript-Snippet hinzuzufügen, dort kann dann, wie hier in Zeile 6 & 7, das Styling angepasst werden.

// Styling of "Deny"-Button - START
window.addEventListener('load', function () {
  const userCentricRoot = document.querySelector('#usercentrics-root');
  const sheet = new CSSStyleSheet;
  sheet.replaceSync( 
    `button[data-testid="uc-deny-all-button"] { background-color: #D1C8A7; } 
     button[data-testid="uc-deny-all-button"]:hover { background-color: #BFB386 }`
  );
  userCentricRoot.shadowRoot.adoptedStyleSheets = [ sheet ];
});
// Styling of "Deny"-Button - END

Schreibe einen Kommentar