Möchten Sie, dass Ihre Besucher ihre Cookie-Auswahl von überall auf Ihrer Website erneut öffnen können? WPConsent wird mit einem Shortcode, einer CSS-Klasse und einer JavaScript-Methode geliefert, die alle dasselbe Präferenzfenster öffnen.

Diese Anleitung führt Sie durch jeden Weg, von einem fertigen Button, den Sie auf eine Seite einfügen, bis zu einer eigenen Codezeile. Alles, was Sie brauchen, ist Ihr Cookie-Banner bereits eingeschaltet.

Inhaltsverzeichnis

• Hinzufügen des Cookie-Präferenz-Buttons
• Ändern der Button-Beschriftung
• Umwandeln eines bestehenden Links in einen Auslöser
• Öffnen des Fensters über Ihren eigenen Code
• Häufig gestellte Fragen

Stellen Sie vor Beginn sicher, dass WPConsent auf Ihrer WordPress-Website installiert und aktiviert ist.

Das Fenster reist mit Ihrem Cookie-Banner, also lassen Sie das Banner eingeschaltet. WPConsent platziert beide zusammen auf der Seite, und jeder der folgenden Wege öffnet das bereits vorhandene Fenster.

Hinzufügen des Cookie-Präferenz-Buttons

Um zu beginnen, fügen wir einen fertigen Button auf einer Ihrer Seiten ein.

WPConsent registriert einen Shortcode, der einen Cookie-Präferenz-Button überall dort ausgibt, wo Sie ihn platzieren. Der Button wird mit der Klasse geliefert, auf die WPConsent achtet, sodass er das Fenster ohne eigene Einrichtung öffnet.

Fügen Sie auf der Seite oder im Beitrag, wo der Button hingehört, einen Shortcode-Block hinzu. Der Shortcode selbst kommt in das Feld des Blocks:

[wpconsent_preferences_button]

Sobald die Seite veröffentlicht ist, wird der Shortcode durch einen Button im eigenen Stil Ihres Themes ersetzt.

Das Klicken auf diesen Button öffnet das Präferenzfenster über der Seite. WPConsent füllt das Fenster aus der gespeicherten Antwort des Besuchers, sodass die Kategorien, die sie bereits erlaubt haben, beim Öffnen aktiviert sind.

Unser Leitfaden zum Präferenzfenster behandelt, was ein Besucher darin tut.

Die Beschriftung des Buttons können Sie ändern, und dafür sind die Attribute des Shortcodes da.

Ändern der Button-Beschriftung

Standardmäßig gibt der Shortcode "Cookie Preferences" auf dem Button aus. Zwei Attribute ändern diese Beschriftung und fügen eigene CSS-Klassen hinzu.

Die Beschriftung ist der einzige Teil des Buttons, den ein Besucher liest. Eine Beschriftung, die zum Rest Ihrer Seite passt, lässt ihn nicht aufgesetzt wirken.

Das text-Attribut ersetzt die Beschriftung:

[wpconsent_preferences_button text="Cookies verwalten"]

Das class-Attribut fügt Ihre eigenen CSS-Klassen neben denen von WPConsent hinzu, was Ihrem Stylesheet etwas zum Anzielen gibt:

[wpconsent_preferences_button text="Cookies verwalten" class="footer-cta"]

• text legt die Beschriftung auf dem Button fest. Wenn es weggelassen wird, steht auf dem Button "Cookie Preferences". Beschriftungen mit Leerzeichen müssen in Anführungszeichen gesetzt werden.
• class fügt CSS-Klassen zum Button hinzu, getrennt durch Leerzeichen. Wenn es weggelassen wird, trägt der Button nur die eigenen Klassen von WPConsent. WordPress bereinigt jeden Wert, also beschränken Sie sich auf Buchstaben, Zahlen, Bindestriche und Unterstriche.

Für einen Link oder Button, der bereits auf Ihrer Website vorhanden ist, erfüllt eine einzelne Klasse denselben Zweck.

Umwandeln eines bestehenden Links in einen Auslöser

Ein Footer-Link, ein Menüpunkt oder ein Button, den Sie bereits erstellt haben, kann das Panel ebenfalls öffnen. WPConsent achtet auf Klicks auf alles, was die Klasse wpconsent-open-preferences trägt. Das Hinzufügen dieser Klasse ist also die ganze Arbeit.

In einem eigenen Link befindet sich die Klasse im öffnenden Tag:

<a href="#" class="wpconsent-open-preferences">Cookie Preferences</a>

Der Link öffnet dann das Panel, anstatt seiner eigenen Adresse zu folgen.

Die Klasse funktioniert auch bei einem Element, das den Link umschließt, was Menüpunkte und Blöcke unkompliziert macht.

Ein WordPress-Menüpunkt behält seine Klasse im Listenelement um den Link. Im Block-Editor platziert das Feld Zusätzliche CSS-Klasse(n) sie auf dem äußeren Element eines Blocks. Beide öffnen das Panel.

Nichts anderes am Link ändert sich. Er behält das Styling Ihres Themes und welche Beschriftung Sie ihm auch immer gegeben haben.

Für eine Steuerung, die anderer Code auf der Seite zeichnet, hat WPConsent eine eigene Methode.

Öffnen des Fensters über Ihren eigenen Code

Einige Steuerelemente werden von einem anderen Plugin erstellt oder von JavaScript nach dem Laden der Seite gezeichnet. Für diese stellt WPConsent das Panel als Methode seines Front-End-Objekts zur Verfügung: WPConsent.showPreferences().

Aufgerufen von einem Klick-Handler öffnet es das Panel genau wie der Präferenzen-Button des Banners:

document.getElementById('cookie-preferences-link').addEventListener('click', function (e) {
    e.preventDefault();
    WPConsent.showPreferences();
});

WPConsent lädt sein Skript in den Footer Ihrer Seite. Die Methode gehört daher in einen Klick-Handler, nicht in Code, der beim Laden der Seite ausgeführt wird. WPConsent.closePreferences() schließt das Panel von derselben Stelle aus wieder.

Das ist alles! Sie wissen jetzt, wie Sie das WPConsent-Präferenzpanel von einem Shortcode-Button, von einem eigenen Link und von Ihrem eigenen JavaScript aus öffnen können.

Sehen Sie sich als Nächstes unseren Leitfaden zum schwebenden Consent-Button an. Er platziert eine permanente Steuerung in der Ecke jeder Seite, die dasselbe Panel öffnet.

Häufig gestellte Fragen

Unten haben wir einige der häufigsten Fragen zum Öffnen des Präferenzpanels von einem eigenen Link aus beantwortet.

Welchen Weg sollte ich wählen?

Der Shortcode ist der schnellste, da er einen funktionierenden Button ohne weitere Einrichtung ausgibt. Die Klasse eignet sich für einen Link oder Menüpunkt, den Sie bereits haben. Die Methode ist für Steuerelemente, die anderer Code auf der Seite platziert.

Wo kann ich den Shortcode verwenden?

Überall dort, wo WordPress Shortcodes ausführt. Das umfasst Ihre Seiten und Beiträge sowie jeden Widget-Bereich oder Vorlagenteil, der einen Shortcode-Block verwendet. Der Button erscheint anstelle des Shortcodes.

Sehen Sie sich Anleitung zum Hinzufügen eines Shortcodes in WordPress für eine Schritt-für-Schritt-Anleitung für jeden dieser Orte an.

Kann ich die Klasse zu einem Navigationsmenüpunkt hinzufügen?

Ja, und es ist ein beliebter Ort dafür. WordPress gibt jedem Menüpunkt auf dem Bildschirm Darstellung » Menüs ein Feld für CSS-Klassen, und die Klasse öffnet das Panel von dort. Wenn dieses Feld nicht angezeigt wird, schalten Sie es über die Bildschirmoptionen oben auf dem Bildschirm ein.

Zeichnet das Öffnen des Panels eine Zustimmung auf?

Nein. Das Öffnen des Panels zeigt einem Besucher nur die zuvor gegebene Antwort. Ihre Wahl wird gespeichert, wenn sie Alle akzeptieren oder Speichern und schließen im Panel verwenden.

Funktioniert mein Link auf jeder Seite?

Es funktioniert auf jeder Seite, auf der WPConsent das Banner platziert. Die Regeln zum Ausblenden des Banners, die das Banner von bestimmten Seiten fernhalten oder von angemeldeten Benutzern fernhalten, halten auch das Panel von diesen Seiten fern.

Unser Leitfaden zu erweiterten Einstellungen behandelt diese Regeln.

Kann ich den Shortcode und den schwebenden Button zusammen verwenden?

Ja. Es handelt sich um separate Einstellungen, und beide öffnen dasselbe Panel. Eine gängige Einrichtung behält den schwebenden Button auf jeder Seite und fügt zusätzlich einen Link zu den Cookie-Einstellungen in die Fußzeile ein.

Wie style ich den Button, den der Shortcode hinzufügt?

Der Button des Shortcodes trägt die Klassen wpconsent-open-preferences und button, die die meisten Themes bereits wie ihre eigenen Buttons stylen. Für alles Spezifischere gibt das class-Attribut Ihrer CSS-Datei eine eigene Klasse, um sie anzusprechen.