Wissensdatenbank (FAQ)

Wie erstelle ich einen individuellen Content Blocker?

Du verwendest ein WordPress Plugin oder einen Service, fĂŒr den es keine Content Blocker Vorlage in Real Cookie Banner gibt? Du kannst jederzeit eine neue Cookie und eine neue Content Blocker Vorlage kostenlos anfragen, und wir werden versuchen, sie zeitnah fĂŒr dich zu implementieren. Alternativ kannst du auch jederzeit einen eigenen Content Blocker selbst erstellen. Dieser Artikel zeigt dir Schritt fĂŒr Schritt, wie du alle notwendigen Informationen findest.

Wir mĂŒssen darauf hinweisen, dass die folgenden Aussagen keine Rechtsberatung darstellen. Wir können dir daher nur EinschĂ€tzungen aus unserer intensiven Erfahrung mit den EU-Rechtsvorschriften in der Praxis und eine technische EinschĂ€tzung der Situation geben.

Wo kann ich einen Content Blocker erstellen?

Gehe in dein WordPress Backend und dort in der linken Seitenleiste durch einen Klick auf Cookies in die Real Cookie Banner Einstellungen. Auf dieser Seite findest du mehrere Tabs. Einer davon heißt Content Blocker erstellen und ist fĂŒr uns relevant. In dem Tab gibt es in der oberen rechten Ecke einen "Content Blocker hinzufĂŒgen"-Button, ĂŒber den wir einen Content Blocker erstellen können. Neben der Auswahl aus Content Blocker Vorlagen finden wir in dieser Ansicht oben einen "Individuell erstellen"-Button, mit dem wir einen Inhaltsblocker erstellen können.

Bitte beachte, dass jeder Content Blocker einen oder mehrere Services benötigt. Sobald diese Services akzeptiert werden, wird der Inhalt geladen (anstelle des Content Blockers). Daher solltest du alle benötigten Services (mit dessen Cookies) erstellen, bevor du deinen individuellen Content Blocker erstellst. Wie das geht, kannst du im Artikel Wie erstelle ich einen individuellen Cookie (Service)? nachlesen.

Was muss bei einem Content Blocker angegeben werden?

Um den Content Blocker zu erstellen, siehst du eine Reihe von Feldern. Unter jedem Feld findest du eine Beschreibung, was genau in das Feld eingegeben werden muss. Bitte lies dir die Beschreibung aufmerksam durch, um zu verstehen, was du in welches Feld eingeben musst. Im Folgenden werden wir auf jedes Feld mit Beispielen nÀher eingehen.

Es gibt die folgende Felder zu auszufĂŒllen:

Name

Der Name des Inhaltsblockers wird in der Überschrift eines sichtbaren Content Blockers angezeigt. Er sollte klar beschreiben, welcher Service nicht geladen werden kann, damit dein Besucher leicht entscheiden kann, ob er dem Cookie (Service) zustimmt, um den jeweiligen Inhalt zu sehen.

Beispiel: YouTube

Name des Content Blockers im Titel des Content Blockers

Beschreibung

Die Beschreibung ist ein Freitextfeld, in dem du deinen Besuchern mehr Informationen darĂŒber geben kannst, was nicht geladen werden konnte und aus welchem Grund. Insbesondere bei z.B. Kontaktformularen kann dies hilfreich sein, um dem Nutzer den Vorteil zu zeigen den Service zuzulassen oder ihm eine E-Mail-Adresse als alternative Möglichkeit zur Kontaktaufnahme zu geben.

Beispiel: Das Video von YouTube wurde blockiert, weil du das Laden nicht erlaubt hast.

Beschreibung wird im Content Blocker angezeigt

URLs / Zu blockierende Elemente

Das Wichtigste bei einem Content Blocker ist die korrekte Angabe, welche Elemente blockiert werden sollen. Eine Regel pro Zeile muss gemĂ€ĂŸ der Syntax, die unterhalb des Eingabefeldes erklĂ€rt wird, angegeben werden.

Im Folgenden findest du eine kurze ErklÀrung zu jedem der Syntaxelemente:

  • *: Mit einem Sternchen kannst du einen Platzhalter (ein beliebiges Zeichen) innerhalb einer Zeichenkette ausdrĂŒcken. Du kannst den Platzhalter sowohl innerhalb einer Zeichenkette als auch vor und nach der Zeichenkette verwenden. FĂŒr eine URL ist es z. B. empfehlenswert nur den Hostnamen und einen Teil des Pfades fest zu definieren, aber sowohl Protokoll als auch Variablen (am Ende des Pfades) als Wildcard beliebig zu definieren. Regeln mit oder ohne Wildcard werden auf alle Elemente innerhalb des HTML angewendet, die dein WordPress generiert.
  • div[id="my-embed"]: Du kannst HTML-Elemente anhand ihrer ID blockieren. Du kannst die Regel auf jedes HTML-Element und Attribut anwenden.
  • p[class*="my-embed"]: Genau wie in der vorherigen Regel kannst du ein HTML-Element ĂŒber seine Klasseneigenschaft blockieren. Allerdings kann ein HTML-Element mehrere Klassen haben. Mit einem Sternchen nach class kannst du eine Enthalten-Bedingung ausdrĂŒcken, sodass diese Klasse enthalten sein muss, aber auch andere Klassen fĂŒr das Element angegeben werden dĂŒrfen.
  • div[data-href^="https://example.com"]: Der ^= Selektor reprĂ€sentiert jedes Element, dessen Attributwert mit einem bestimmten Wert beginnt.
  • div[data-href$=".pdf"]: Der $= Selektor reprĂ€sentiert jedes Element, dessen Attributwert mit einem bestimmten Wert endet.
  • div[data-gyp-href]: Diese Syntax reprĂ€sentiert jedes Element mit einem bestimmten Attribut, unabhĂ€ngig vom Wert.
  • div[class*="my-embed"][data-gyp-href]: Mit dieser Syntax kannst du alle Elemente mit zwei Attributbedingungen finden. Du kannst Attributselektoren unbegrenzt verketten (seit Version 2.13.0)
  • div[data-href:myFunction(),anotherFunction(arg1=1&arg2=2)]: With this syntax an additional function can be called for matching (since version > 3.4.3). See section “Selector syntax functions” for more information.

Die Regeln sind abstrakt, daher möchten wir dir ein paar Beispiele geben, was in welchem Fall blockiert wird. Beachte, dass wir fĂŒr die gezeigten Beispiele auch schon eine Vorlage haben.

Blockieren von z.B. einem Iframe anhand einer URL

HTML-Code in deiner Website:

<iframe width="560" height="315" src="https://www.youtube.com/embed/XtLWonUXAmO" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

Regel zum Blockieren: *youtube.com/embed/*

Blockieren von z. B. einem Skript basierend auf einer URL

HTML-Code in deiner Website:

<script async src="https://www.googletagmanager.com/gtag/js?id=UA-123456789-1"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-123456789-1'); </script>

Regeln fĂŒr das Blockieren:

*googletagmanager.com/gtag/js?id=*
*window.dataLayer*

Nicht nur das externe Skript wird anhand der URL blockiert, sondern auch das Inline-Skript anhand des angegebenen SchlĂŒsselworts.

Blockieren eines HTML-Elements anhand seiner ID

HTML-Code in deiner Website:

<div id="addtoany_list" class="green">
   [...]
</div>

Regel zum Blockieren: div[id="addtoany_list"]

Blockieren eines HTML-Elements anhand seinem Klassennamen

HTML-Code in deiner Website:

<div class="addtoany addtoany_share_save_container addtoany_widget">
   [...]
</div>

Regel zum Blockieren: div[class*="addtoany_share_save_container"]

Blockieren eines HTML-Elements durch ein benutzerdefiniertes Attribut

HTML-Code in deiner Website:

<div data-youtube-embed="https://www.youtube.com/embed/XtLWonUXAmO">
   [...]
</div>

Regel zum Blockieren: div[data-youtube-embed*="youtube.com/embed"]

Blockieren eines HTML-Elements durch zwei benutzerdefinierte Attribute (seit Version 2.13.0)

HTML-Code in deiner Website:

<div data-youtube-embed="https://www.youtube.com/embed/XtLWonUXAmO" block-this="1">
   [...]
</div>

Regel zum Blockieren: div[data-youtube-embed*="youtube.com/embed"][block-this="1"]

Skript von einem Plugin blockieren

In manchen FÀllen möchtest du ein Plugin komplett blockieren, weil es externe Daten lÀdt (z.B. Contact Form 7 mit Google reCAPTCHA).

HTML-Code in deiner Website:

<script src="https://your-domain.com/wp-content/plugins/contact-form-7/js/script.js" />

Regel zum Blockieren: *wp-content/plugins/contact-form-7/*

Blockieren eines Links (explizit)

Du kannst jedes Element mit einem Content Blocker blockieren. StandardmĂ€ĂŸig werden Links (<a>-Elemente) jedoch nur blockiert, wenn du das Element explizit wie folgt blockierst. Regeln wie das Blockieren nach URL (erstes Beispiel) werden ansonsten nicht auf Links angewendet, um zu verhindern, dass der Content Blocker zu viel blockiert.

<a href="https://www.youtube.com/watch?v=INJ_sS81ua8">Watch with awesome video</a>

Regel zum Blockieren: a[href*="youtube.com"]

Selektor-Syntaxfunktionen

Seit Real Cookie Banner > v3.4.3 unterstĂŒtzt das Plugin Funktionen, die auf Selektor-Syntax-Attribute angewendet werden können. Dies ermöglicht mehr FlexibilitĂ€t bei der Lösung komplexer Selektorregeln. Die folgende Liste von Funktionen ist derzeit implementiert:

div[data-href:matchesUrl()]

Stell dir vor, du hast einen Inhaltsblocker mit den folgenden Regeln erstellt:

*youtube.com*
*youtu.be*
div[data-href*="youtube.com"]
div[data-href*="youtu.be"]

Anstatt zwei Regeln fĂŒr das div zu schreiben, können wir dies mit div[data-href:matchesUrl()] lösen. Sie ĂŒbernimmt automatisch alle Nicht-Selektor-Syntaxregeln des Content Blockers und prĂŒft diese mit data-href:

*youtube.com*
*youtu.be*
div[data-href:matchesUrl()]

Verbundene Cookies

Inhalte werden nur so lange blockiert, bis dein Besucher seine Einwilligung gibt. Du musst definieren, welche Cookies fĂŒr den Content Blocker akzeptiert werden mĂŒssen, damit der Inhalt geladen werden kann. Der Inhalt wird nur geladen, wenn alle definierten Cookies (Services) akzeptiert werden.

WordPress Plugins von devowl.io

Finde hilfreiche Artikel

Themen