Barrierefreiheitserklärung in WordPress und WooCommerce einbinden
Veröffentlicht am 24. Oktober 2026
Ihre Barrierefreiheitserklärung binden Sie in WordPress und WooCommerce in vier Schritten ein: als eigene Seite unter Pages > Add New mit echten Überschriftenblöcken, als Link im Footer (im Block-Theme über den Website-Editor, im klassischen Theme über Appearance > Menus), als kurzer Abschnitt in Ihrer AGB-Seite, die Sie unter WooCommerce > Settings > Advanced > Page setup als Terms and conditions zuweisen, und mit einem Meldeweg per E-Mail-Link oder Kontaktformular. Über die AGB-Seite erreichen Kunden die Erklärung auch im Checkout, denn WooCommerce verlinkt die zugewiesene AGB-Seite dort, im klassischen Checkout klappt sie sogar direkt auf.
Was inhaltlich in die Erklärung gehört und einen Text zum Ausfüllen finden Sie im Muster für die Barrierefreiheitserklärung im Onlineshop. Hier geht es nur um die Einbindung: jeder Klickweg so, wie ihn die Dokumentation von WordPress.org und von WooCommerce beschreibt. Theme, Plugins, Kontraste und Formulare im übrigen Shop behandelt WooCommerce barrierefrei machen.
Beide Dokumentationen sind englisch. Wir nennen die englischen Menünamen, damit Sie sie mit der Doku abgleichen können; in einem deutschsprachigen Dashboard stehen dort die übersetzten Bezeichnungen.
Die rechtliche Grundlage in Kürze
Nach § 14 Abs. 1 Nr. 2 BFSG dürfen Sie Ihren Shop nur anbieten, wenn Sie die Informationen nach Anlage 3 Nummer 1 erstellt und „für die Allgemeinheit in barrierefreier Form zugänglich gemacht“ haben. Anlage 3 BFSG verlangt, soweit anwendbar, diese Elemente:
| Buchstabe | Anlage 3 verlangt | Was Sie bei WooCommerce konkret beschreiben |
|---|---|---|
| a | „eine allgemeine Beschreibung der Dienstleistung in einem barrierefreien Format“ | was Sie verkaufen, an wen, unter welcher Domain |
| b | „Beschreibungen und Erläuterungen, die zum Verständnis der Durchführung der Dienstleistung erforderlich sind“ | Produktsuche, Warenkorb, Kundenkonto, Checkout, Zahlungsarten, Kontakt |
| c | „eine Beschreibung, wie die Dienstleistung die einschlägigen [...] Barrierefreiheitsanforderungen erfüllt“ | Theme und Version, Block-Checkout oder klassischer Checkout, wichtige Plugins, Prüfmethode und Datum, bekannte Einschränkungen |
| d | „die Angabe der zuständigen Marktüberwachungsbehörde“ | die MLBF mit Name und Anschrift, wie im Muster |
Wo die Information stehen darf, regelt Anlage 3 Nummer 1 ebenfalls: „in seinen Allgemeinen Geschäftsbedingungen oder auf andere deutlich wahrnehmbare Weise“. Für WordPress heißt das nach unserer Lesart: eine eigene Seite für den vollständigen Text, dazu ein Verweis in den AGB, weil WooCommerce die AGB im Checkout verlinkt.
Schritt 1: die Seite im Block-Editor anlegen
Die WordPress-Doku zu Seiten nennt „Accessibility Statement“ ausdrücklich als Beispiel für eine Seite. Der Weg laut dieser Doku:
- Im WordPress-Dashboard Pages > Add New in der linken Seitenleiste wählen.
- Einen Titel eingeben, zum Beispiel „Erklärung zur Barrierefreiheit“.
- Den Text Ihrer Erklärung mit Blöcken einfügen.
- Die Einstellungen in der Seitenleiste prüfen.
- Publish klicken.
Echte Überschriften statt fetter Absätze. Die Informationen müssen nach § 14 Abs. 1 Nr. 2 BFSG selbst barrierefrei zugänglich sein, und eine fett gesetzte Zeile ist für einen Screenreader keine Überschrift. Die WordPress-Doku zum Heading-Block beschreibt mehrere Wege: Tippen Sie in einem neuen Absatz ## und ein Leerzeichen für eine Überschrift der Stufe H2, ### für H3, oder /h2 und Enter. Die Doku schreibt: „In most cases, the page title is used as the <h1> tag, with subsequent Heading blocks added as H2, H3, and so on.“ Setzen Sie Abschnitte wie „Unser Shop“ oder „Barriere melden“ deshalb als H2. Die Stufe eines vorhandenen Blocks ändern Sie über den Transform-Button in der Block-Werkzeugleiste oder im Block-Einstellungsbereich. Zur Kontrolle empfiehlt dieselbe Doku: „View the Outline tab in the Document Overview to see your page headings.“
Text statt Bild oder eingescanntem PDF. Für die Zugänglichmachung verweist § 14 Abs. 1 Nr. 2 BFSG auf die BFSGV. Nach unserer Lesart gilt deshalb auch für die Erklärung § 12 Nr. 2 Buchstabe e BFSGV: Der Informationsinhalt wird „in Textformaten zur Verfügung gestellt, die sich zum Generieren alternativer assistiver Formate durch den Verbraucher eignen“. Eine WordPress-Seite aus Absatz- und Überschriftenblöcken erfüllt das am einfachsten. Ein Bildblock mit dem Text oder ein angehängtes Scan-PDF erfüllt es nicht.
Eine kurze, feste Adresse. Laut der Doku zu Seiten öffnen Sie in der Seitenleiste unter Summary den URL-Link und ändern das Feld Permalink, danach Update. Eine Adresse wie /barrierefreiheit lässt sich am Telefon diktieren und in den AGB nennen. Ändern Sie die Adresse später, prüfen Sie alle Links darauf neu: Laut der WordPress-Doku zum Link-Werkzeug prüft WordPress nur das Format eines Links, „It does not confirm that the destination page exists or loads successfully.“
Wenn ein Plugin die Seite erzeugt hat
Ein Beispiel aus dem WordPress-Pluginverzeichnis ist StudioMeyer Barrierefrei-Check. Laut seiner Beschreibung legt es die Erklärung als Entwurf an: „Pages are generated as drafts in the languages you choose“. Unter Pages finden Sie den Entwurf, prüfen ihn und veröffentlichen ihn selbst. Die Beschreibung zählt einen „feedback contact“ zu den Pflichtelementen von Anlage 3; im Gesetzestext steht er dort nicht, er ist aber sinnvoll (siehe Schritt 4). Prüfen Sie jede erzeugte Seite gegen die Tabelle oben, wie es Barrierefreiheitserklärung per Generator beschreibt, und gehen Sie die Schritte 2 bis 4 trotzdem durch.
Schritt 2: der Link im Footer
Welcher Weg gilt, hängt vom Theme ab. Laut WordPress-Doku zum Website-Editor gibt es den Website-Editor nur mit einem Block-Theme; dann finden Sie im Dashboard Appearance > Editor. Steht dort stattdessen Appearance > Menus, nutzen Sie ein klassisches Theme.
Block-Theme: Footer im Website-Editor
Laut der Doku zum Website-Editor sind Header und Footer Template Parts, also wiederkehrende Bereiche, die Sie unter Patterns verwalten. Die Doku zeigt den genauen Weg am Beispiel des Headers (Patterns > Template Parts > Header, Stiftsymbol). Für den Footer gehen Sie nach unserer Lesart genauso vor:
- Appearance > Editor öffnen.
- Patterns wählen und unter den Template Parts den Footer öffnen, dann über das Stiftsymbol bearbeiten.
- Im Footer den Navigation-Block mit den rechtlichen Links auswählen. Steht dort nur eine automatische Seitenliste, wandelt laut WordPress-Doku zum Navigation-Block erst Edit in der Block-Werkzeugleiste und Edit im folgenden Dialog sie in einzelne Links um.
- + (Add page) klicken, einen Teil des Seitentitels eingeben und Ihre Erklärung auswählen.
- Unter Text im Einstellungsbereich den Linktext setzen, etwa „Barrierefreiheit“.
- Save klicken.
Die Doku zum Website-Editor weist darauf hin, dass Änderungen am Footer für alle Seiten gelten, die diesen Footer verwenden. Enthält Ihr Footer keinen Navigation-Block, sondern einfache Absätze, markieren Sie dort einen Text und verlinken ihn mit Strg+K auf die Seite, wie es die Doku zum Link-Werkzeug beschreibt.
Klassisches Theme: Design > Menüs
Weg laut WordPress-Doku zum Menü-Bildschirm:
- Appearance > Menus öffnen und das Menü wählen, das im Footer erscheint, oder über Create a new menu eines anlegen: einen Namen ins Feld Menu Name eingeben und Create Menu klicken.
- Im Bereich Pages auf View All klicken, Ihre Erklärung ankreuzen und Add to Menu klicken.
- Unten unter Menu Settings > Display location den Footer-Bereich Ihres Themes ankreuzen, sofern das Theme einen anbietet.
- Save Menu klicken.
Unterstützt Ihr Theme keine eigenen Menüs, verweist die Doku auf das Menü-Widget unter Appearance > Widgets. Welche Menüorte es gibt, bestimmt das Theme; laut Doku bieten nur manche Themes ein eigenes Footer-Menü.
Ein Vergleich, den WordPress selbst liefert. Für die Datenschutzerklärung hat WordPress unter Settings > Privacy ein eigenes Werkzeug. Selbst dafür schreibt die WordPress-Doku zu den Datenschutzeinstellungen: „It is your responsibility to create a link to the Privacy Policy page to every page on your site.“ Für die Erklärung zur Barrierefreiheit gibt es kein solches Werkzeug; den Link setzen Sie von Hand, am besten direkt neben Impressum und Datenschutz.
Schritt 3: die Erklärung im Checkout erreichbar machen
Laut WooCommerce-Doku zum Checkout-Template zeigt die Checkout-Vorlage eines Block-Themes standardmäßig einen vereinfachten Header, nur mit Titel und Logo der Website. Ihr gewohntes Hauptmenü fehlt dort also. Was im Footer des Checkouts steht, beschreibt die Doku nicht; prüfen Sie es mit einer Testbestellung.
Sicher erreichbar ist im Checkout die AGB-Seite. Weg laut WooCommerce-Doku zu den Seiten und zu den erweiterten Einstellungen:
- Ihre AGB als Seite unter Pages > Add New anlegen, falls noch nicht geschehen.
- WooCommerce > Settings > Advanced öffnen, Bereich Page setup.
- Im Auswahlfeld Terms and conditions Ihre AGB-Seite wählen.
- Save changes klicken.
Was der Kunde dann sieht, unterscheidet sich je nach Checkout. Laut der Doku zu den erweiterten Einstellungen erscheinen die AGB im klassischen Checkout „inline during checkout“ und klappen auf, wenn der Kunde den Link „Terms & Conditions“ wählt. Im Block-Checkout erscheint der Satz „By proceeding with your purchase you agree to our Terms and Conditions and Privacy Policy“ mit Links auf die jeweiligen Seiten, sofern sie zugewiesen sind. Den Satz können Sie laut Doku im Block-Editor bearbeiten.
Ergänzen Sie in Ihrer AGB-Seite deshalb einen kurzen Abschnitt mit eigener H2-Überschrift. Ein Beispiel, das Sie anpassen:
Barrierefreiheit: Wie unser Shop die Anforderungen an die Barrierefreiheit erfüllt, wo es noch Einschränkungen gibt und wie Sie uns Barrieren melden, beschreiben wir in unserer Erklärung zur Barrierefreiheit unter [ihr-shop.de/barrierefreiheit]. Barrieren melden Sie per E-Mail an [barrierefreiheit@ihr-shop.de].
Nach unserer Lesart ist das der Weg mit dem geringsten Risiko: Der Hinweis steht in den AGB, die Anlage 3 ausdrücklich nennt, und er ist mitten im Checkout erreichbar, im klassischen Checkout sogar ohne Seitenwechsel. Den ganzen Text in die AGB zu kopieren, ist nicht nötig; zwei Fassungen müssten Sie doppelt pflegen.
Schritt 4: den Meldeweg einrichten
Einen Meldeweg nennt Anlage 3 BFSG nicht. Nach unserer Lesart ist er nicht vorgeschrieben, aber sinnvoll; warum, erklärt Meldeweg für Barrieren im Onlineshop. In WordPress gibt es zwei einfache Wege.
E-Mail-Link in der Erklärung. Laut WordPress-Doku zum Link-Werkzeug markieren Sie die Adresse im Absatz, drücken Strg+K (am Mac ⌘+K) und tragen sie im Format mailto:name@example.com ein; dieses Format steht dort ausdrücklich unter „Supported URLs“. Lassen Sie die Adresse als Text sichtbar, damit Kunden sie auch abschreiben können.
Kontaktformular per Plugin. WordPress selbst bringt kein Formular mit. Laut WordPress-Doku zu Plugins suchen Sie unter Plugins > Add New und installieren mit Install Now. Wie Sie das Formular danach einrichten, beschreibt der Plugin-Anbieter. Drei Dinge prüfen Sie bei jedem Formular-Plugin selbst: dass jedes Feld eine sichtbare Beschriftung hat, dass eine Testnachricht in Ihrem Postfach ankommt und ob ein Captcha vorgeschaltet ist. Nennen Sie die E-Mail-Adresse immer zusätzlich neben dem Formular; wer am Formular scheitert, hat dann einen zweiten Weg. Legen Sie das Formular auf eine eigene Seite „Barriere melden“ und verlinken Sie diese wie in Schritt 2 im Footer.
Antworten können. Gibt es bei Ihnen einen Kundenservice, muss er nach § 12 Nr. 4 BFSGV die Informationen über die Barrierefreiheit „mit barrierefreien Kommunikationsmitteln“ bereitstellen. Legen Sie fest, wer das Postfach liest.
Prüfliste: Ist die Erklärung richtig eingebunden?
Gehen Sie die Liste einmal mit der Maus und einmal nur mit der Tastatur durch (Tab, Umschalt+Tab, Enter).
| Prüfpunkt | So prüfen Sie | Wo Sie es in WordPress ändern |
|---|---|---|
| Seite ist veröffentlicht | Seite in einem privaten Browserfenster ohne Anmeldung öffnen | Pages, Status der Seite, Publish |
| Echte Überschriften | Im Editor Document Overview > Outline öffnen, jeder Abschnitt erscheint dort als H2 | Heading-Block, Transform oder Block-Einstellungen |
| Elemente a bis d enthalten | Text gegen die Tabelle oben legen | Pages, Ihre Erklärung |
| Footer-Link auf allen Shopseiten | Startseite, Produktseite, Warenkorb und Kontaktseite öffnen | Block-Theme: Appearance > Editor > Patterns > Footer; klassisch: Appearance > Menus |
| Link per Tastatur erreichbar | Mit Tab bis zum Footer gehen, Fokus muss sichtbar sein, Enter öffnet die Seite | Theme (siehe WooCommerce barrierefrei machen) |
| AGB im Checkout zugewiesen | Testbestellung bis zur Zahlungsseite, AGB-Link öffnen, Abschnitt Barrierefreiheit muss dort stehen | WooCommerce > Settings > Advanced > Page setup |
| Meldeweg funktioniert | Testmail an die Adresse, Testnachricht über das Formular | Link-Werkzeug, Formular-Plugin |
| Kein toter Link | Nach jeder Änderung der Adresse Footer-Link und AGB-Link anklicken | Pages > Summary > URL, Footer, AGB-Seite |
| Stand-Datum stimmt | Datum am Ende der Erklärung mit letzter Änderung vergleichen | Pages, Ihre Erklärung |
Aktuell halten
Nach § 14 Abs. 2 BFSG bewahren Sie die Informationen auf, solange Sie den Shop anbieten, und nach § 14 Abs. 3 tragen Sie Veränderungen bei der Art und Weise der Erbringung „gebührend Rechnung“. Typische Anlässe in WordPress sind ein Theme-Wechsel, der Umstieg vom klassischen auf den Block-Checkout oder zurück, ein neues Plugin im Warenkorb oder Checkout und eine neue Zahlungsart. Überarbeiten Sie dann die Abschnitte zu b und c, ändern Sie das Stand-Datum und bewahren Sie die alte Fassung bei Ihren Unterlagen auf, zum Beispiel als PDF-Ausdruck der Seite.
Dieser Ratgeber ist keine Rechtsberatung. Im Zweifel klären Sie Ihren Fall mit der Bundesfachstelle Barrierefreiheit oder einer Anwältin oder einem Anwalt.
Ihr nächster Schritt
Der kostenlose Scan prüft ohne Anmeldung Ihre Startseite, eine Produktseite und den Warenkorb automatisch gegen die WCAG-Regeln und zeigt, was Sie zuerst beheben sollten. Automatische Werkzeuge finden nur einen Teil aller Barrieren; ob der Link zur Erklärung im Checkout erreichbar ist und Ihr Meldeformular ankommt, prüfen Sie zusätzlich selbst mit der Prüfliste oben.
Stand: 24.10.2026. Quellen gelesen am 24.10.2026.