WordPress
Das Widget mit dem WordPress-Plugin einbinden
Das Plugin Pocket Rocket A11y lädt das Widget auf jeder Seite einer WordPress-Website. Mit einem Verbindungsschlüssel stellen Sie Funktionen, Design und Sprachen des Widgets direkt in WordPress ein und prüfen die Website mit einem Audit. Sie bekommen das Plugin als Zip-Datei von Pocket Rocket. Es braucht WordPress 6.3 oder neuer und PHP 7.4 oder neuer.
Installieren
- Im WordPress-Backend unter Plugins → Installieren → Plugin hochladen die Zip-Datei hochladen und aktivieren.
- Im Dashboard unter Einbindung den Token der Website kopieren. Hat die WordPress-Website eine andere Adresse als die Website im Dashboard, tragen Sie diese Adresse unter Sicherheit ein.
- In WordPress im Menü Pocket Rocket A11y → Verbindung den Token einfügen und speichern.
- Verbindung testen drücken.
- Optional: Im Dashboard unter API einen Verbindungsschlüssel mit den Rechten „Einstellungen“ und „Audit“ erstellen, in WordPress auf der Seite Verbindung einfügen und speichern.
Verbindung
Das Plugin hat einen eigenen Eintrag im Menü links mit den Seiten Verbindung, Funktionen, Design, Sprachen und Audit.
| Feld | Bedeutung |
|---|---|
| Widget | Widget auf der Website laden; ausgeschaltet bleiben Token und Server gespeichert |
| Widget-Token | der Token aus dem Bereich Einbindung; er ist öffentlich und steht im Quelltext der Seite |
| Server | https://a11y.pocket-rocket.io, nur bei einem eigenen Server ändern |
| Verbindungsschlüssel | optional, für die Seiten Funktionen, Design, Sprachen und Audit; nach dem Speichern zeigt WordPress nur noch seinen Anfang |
Das Plugin bindet das Widget mit defer am Ende der Seite ein, im Backend lädt es nichts.
Der Verbindungsschlüssel braucht im Paket des Kontos das Modul Integrationen, für die Seite Audit zusätzlich Audit. Fehlt es, bindet das Plugin das Widget weiter ein, nur die Seiten Funktionen, Design, Sprachen und Audit melden einen Fehler.
Verbindung testen
Der Test fragt den Server mit der Adresse der WordPress-Website als Absender, genauso wie später der Browser eines Besuchers. Mögliche Antworten:
| Antwort | Was zu tun ist |
|---|---|
| Verbunden | nichts, das Widget läuft |
| Token wurde nicht gefunden | den Token erneut aus dem Bereich Einbindung kopieren |
| nicht als Domain freigegeben | die angezeigte Adresse unter Sicherheit eintragen |
| nicht erreichbar | die Server-Adresse prüfen; blockiert eine Firewall des Hosters ausgehende Verbindungen? |
| Verbindungsschlüssel gültig | nichts; die Antwort nennt die Website und die Rechte des Schlüssels |
| Verbindungsschlüssel ungültig | der Schlüssel wurde widerrufen oder falsch kopiert: unter API einen neuen erstellen |
Paket
Mit gespeichertem Verbindungsschlüssel liest das Plugin das Paket des Kontos und zeigt nur, was darin enthalten ist:
| Im Paket | im Plugin |
|---|---|
| immer | Seiten Verbindung und Design |
| Barrierefreiheit | Seite Funktionen |
| Übersetzung | Seite Sprachen und der Schalter Übersetzung unter Funktionen |
| Modul KI | Leichte Sprache und Wörterbuch unter Funktionen |
| Modul Audit (mit Barrierefreiheit) | Seite Audit |
| Sprachen je Website | Sprachen zeigt die Grenze und lässt nicht mehr einschalten; Deutsch zählt nicht |
Auf der Seite Verbindung zeigt der Kasten Paket Name, Produkte, das Ende einer Testphase und die Seiten im Paket; der Verbindungstest nennt das Paket ebenfalls. Bei einem Paket nur mit Übersetzung deckt der Textvorschlag für die Datenschutzerklärung nur die Übersetzung ab und der Button des Shortcodes heißt „Sprache“.
Das Plugin fragt das Paket alle 12 Stunden ab, beim Verbindungstest und bei jedem Speichern sofort. Ändern Sie das Paket im Dashboard, zeigt WordPress das spätestens nach 12 Stunden. Ruft jemand eine Seite auf, die nicht im Paket ist, erscheint ein Hinweis statt eines Fehlers. Ohne Verbindungsschlüssel kennt das Plugin das Paket nicht und zeigt alle Seiten.
Funktionen, Design und Sprachen
Mit gespeichertem Verbindungsschlüssel zeigen diese Seiten die aktuellen Einstellungen der Website im Dashboard. Speichern ändert sie dort; Besucher sehen die Änderung auf der nächsten Seite, die sie öffnen.
| Seite | Was Sie einstellen |
|---|---|
| Funktionen | jede Funktion an oder aus, je Kategorie auch alle auf einmal; Suchfeld, Symbole, Einstellungen der Besucher merken |
| Design | Widget-Button oder eigener Auslöser, Farben des Buttons, Position, Größen und die acht Farben des Widgets; eine Vorschau zeigt Änderungen schon vor dem Speichern |
| Sprachen | die Sprachen, in die das Widget übersetzt, und die Flagge, die es neben jeder Sprache zeigt, mit Vorschau |
Funktionen, die eine KI brauchen (Leichte Sprache, Wörterbuch), erscheinen erst, wenn sie im Dashboard eingerichtet ist. Haben Sie im Dashboard eigene Abschnitte angelegt, bleiben sie: Eine in WordPress eingeschaltete Funktion kommt in den ersten Abschnitt, eine ausgeschaltete verschwindet aus ihrem Abschnitt. Abschnitte, Reihenfolge, Favoriten, Symbole und alles Weitere stellen Sie im Dashboard ein.
Der Verbindungsschlüssel bleibt auf dem WordPress-Server und erscheint nie im Quelltext der Seiten. Nur Administratoren sehen die Seiten. Wird ein Schlüssel nicht mehr gebraucht, widerrufen Sie ihn im Dashboard unter API.
Audit
Mit einem Verbindungsschlüssel mit dem Recht „Audit“ prüft die Seite Audit die Website wie der Audit im Dashboard. Der Audit läuft auf dem Server von Pocket Rocket, Sie können die Seite währenddessen verlassen.
| Bereich | Inhalt |
|---|---|
| Neuer Audit | Zahl der Seiten (vorbelegt mit dem Seitenlimit aus dem Zeitplan im Dashboard) und optional eine Startadresse, die zur Website gehören muss |
| Audit läuft | geprüfte Seiten mit Fortschrittsbalken, alle paar Sekunden aktualisiert; „Audit abbrechen“ beendet den Lauf. Danach zeigt die Seite von selbst das Ergebnis |
| Ergebnis | Punktzahl, Vergleich mit dem vorherigen Audit, geprüfte Seiten, Probleme, betroffene Elemente und Probleme je Schweregrad |
| Probleme | nach Schweregrad, aufklappbar mit Beschreibung, betroffenen Seiten und Link zur Regel bei Deque |
| Seiten | Punktzahl und Zahl der Probleme je Seite, die niedrigste Punktzahl zuerst |
| Verlauf | die letzten 20 Audits; ein Klick zeigt das Ergebnis eines älteren Audits |
Die Texte zu den Problemen kommen auf Deutsch vom Server, auch wenn WordPress auf Englisch eingestellt ist.
PDF-Bericht
PDF-Bericht öffnet den Bericht zum angezeigten Audit in einem neuen Tab, ohne Anmeldung im Dashboard. Dort speichert „Als PDF speichern oder drucken“ ihn als PDF. Deckblatt, Einleitung, Kontakt und Hinweis kommen aus den Berichtsangaben des Inhabers des Kontos im Dashboard, „Erstellt für“ aus der Website.
Der Link gilt eine Stunde und nur für diesen Audit. Sein Schlüssel steht hinter # in der Adresse; diesen Teil schickt der Browser nicht an den Server, er landet also in keinem Server-Log. Für einen neuen Link drücken Sie in WordPress noch einmal PDF-Bericht.
Andere Übersetzungs-Plugins
Ist Weglot, GTranslate, TranslatePress, WPML oder Polylang aktiv, zeigt die Seite Sprachen oben einen Kasten mit dem gefundenen Plugin und seinen Sprachen. Die anderen Seiten des Plugins weisen mit einem Hinweis darauf hin.
- Zusammenarbeit: Solange das andere Plugin aktiv ist, zeigt das Widget dessen Sprachen zuerst und übergibt sie daran; Besucher bekommen keine zwei Übersetzungen. Alle anderen Sprachen übersetzt das Widget. Mehr unter Andere Übersetzungswerkzeuge.
- Sprachen übernehmen: Der Button schaltet die Sprachen des anderen Plugins im Widget ein, zusätzlich zu den schon eingeschalteten. Dafür braucht es den Verbindungsschlüssel mit dem Recht „Einstellungen“.
- Ersetzen: Die Anleitung im Kasten führt durch den Wechsel: Sprachen übernehmen, Sprachumschalter entfernen, die übersetzten Adressen wie
/en/dauerhaft auf die Originalseiten umleiten (mit einer fertigen Zeile für die.htaccess), das Plugin löschen, den Cache leeren und ein Abo kündigen.
Sprachumschalter
Der Shortcode [pocket_rocket_a11y_switcher] setzt einen Sprachumschalter wie in WPML: Flagge und Name der aktuellen Sprache mit einem kleinen Pfeil, zum Beispiel „Deutsch ▾“. Ein Klick öffnet direkt darunter eine Liste mit der Sprache der Seite und den eingeschalteten Sprachen, je mit Flagge und Namen; die Wahl übersetzt die Seite sofort, ohne das Widget zu öffnen. Flagge und Name wechseln mit („English ▾“). Die Liste lässt sich mit den Pfeiltasten, Pos1, Ende, dem ersten Buchstaben und Escape bedienen und schließt bei einem Klick daneben. Mit einer Widget-Version vor 1.0.3 öffnet der Klick stattdessen die Sprachauswahl des Widgets.
| Variante | Anzeige |
|---|---|
[pocket_rocket_a11y_switcher] | Flagge und Name in der eigenen Sprache |
[pocket_rocket_a11y_switcher show="code"] | Flagge und Kürzel, zum Beispiel DE |
[pocket_rocket_a11y_switcher show="flag"] | nur die Flagge; Screenreader hören trotzdem „Sprache wählen, aktuell: Deutsch“ |
- Im Menü: einen individuellen Link mit der URL
#pocket-rocket-a11yund der CSS-Klassepocket-rocket-a11y-switcheranlegen (CSS-Klassen unter Design → Menüs in den Ansicht-Optionen einblenden). In Page Buildern wie Oxygen oder Elementor das Shortcode-Element verwenden. - Aussehen: Der Umschalter übernimmt Schrift, Farbe und Großschreibung des Menüs und bringt keine eigenen Farben mit. Die Liste ist weiß mit dunkler Schrift; anpassen lässt sie sich im eigenen CSS mit
--pr-a11y-menu-bg,--pr-a11y-menu-text,--pr-a11y-menu-borderund--pr-a11y-menu-hover. Die Flaggen kommen vom Server und folgen der Wahl unter Flaggen im Widget. - Nur Ihr Umschalter: Soll der runde Widget-Button verschwinden, wählen Sie unter Design „Eigener Trigger“.
Eigenes CSS
Auf der Seite Verbindung nimmt das Feld Eigenes CSS Regeln auf, die das Plugin auf jeder Seite lädt, zum Beispiel für den Sprachumschalter (.pocket-rocket-a11y-switcher, .pocket-rocket-a11y-switcher-flag img, .pocket-rocket-a11y-switcher-arrow) oder den Button des Shortcodes (.pocket-rocket-a11y-button). Das Widget-Panel selbst erreicht es nicht; Farben und Größen dort stellen Sie unter Design ein.
:root { --pr-a11y-menu-bg: #1d1d1b; --pr-a11y-menu-text: #ffffff; --pr-a11y-menu-hover: rgba(255, 255, 255, 0.1); }
.pocket-rocket-a11y-switcher { gap: 0.6em; font-weight: 600; }
.pocket-rocket-a11y-switcher-flag img { border-radius: 50%; width: 1.2em; height: 1.2em; }Eigener Button
- Shortcode:
[pocket_rocket_a11y_button]setzt einen Button „Barrierefreiheit“. Eigener Text und eigene CSS-Klassen:[pocket_rocket_a11y_button label="Hilfen" class="wp-element-button"]. - Menü: im Menü oder Navigationsblock einen individuellen Link mit der URL
#pocket-rocket-a11yanlegen. In klassischen Menüs wirkt auch die CSS-Klassepocket-rocket-a11yan einem Menüpunkt. - Überall: jeder Link und Button mit der Adresse
#pocket-rocket-a11yöffnet das Widget. - Gebärdensprache: ein Link mit der URL
#pocket-rocket-a11y-dgsöffnet die Videos in Gebärdensprache und die Texte in Leichter Sprache, sobald sie unter Gebärdensprache eingerichtet sind.
Solche Links werden zu Buttons mit aria-expanded und lassen sich mit Enter und Leertaste bedienen; die Adresse der Seite ändert sich beim Klick nicht. Soll nur der eigene Button erscheinen, wählen Sie auf der Seite Design in WordPress „Eigener Trigger“ oder stellen im Dashboard unter Design beim Widget-Button einen eigenen Auslöser ein.
Datenschutz
Das Plugin legt unter Einstellungen → Datenschutz → Leitfaden einen Textvorschlag für die Datenschutzerklärung ab. Derselbe Text steht auf der Seite Verbindung im Kasten Datenschutz mit dem Button Text kopieren; er passt zum Paket, bei einem Paket nur mit Übersetzung beschreibt er nur die Übersetzung. Ergänzen Sie die Rechtsgrundlage und entfernen Sie Abschnitte zu Werkzeugen, die Sie nicht mehr nutzen, etwa Weglot. Solange die Datenschutzerklärung Pocket Rocket A11y nicht erwähnt, zeigt das Plugin auf dem Dashboard, der Seite Plugins und seinen eigenen Seiten einen Hinweis; ebenso, wenn keine Datenschutzseite gefunden wird oder die Erklärung nach dem Entfernen noch Weglot nennt. Geprüft wird die unter Einstellungen → Datenschutz festgelegte Seite, ohne sie eine Seite mit der Adresse datenschutz, datenschutzerklaerung oder privacy-policy, auch mit Inhalten aus Page Buildern wie Oxygen oder Elementor. Mehr unter Datenschutz. Das Plugin selbst speichert nur seine Einstellungen und setzt keine Cookies. Funktionen, Design und Sprachen speichert es nicht in WordPress, sondern schickt sie direkt an den Server von Pocket Rocket. Audit-Ergebnisse liegen nur dort; WordPress zeigt sie an, ohne sie zu speichern.
Entfernen
Plugin deaktivieren und löschen: Die Einstellungen werden dabei mit gelöscht, auch der Verbindungsschlüssel. Widerrufen Sie ihn danach im Dashboard unter API.