Endlich nativ: Der neue Tabs-Block in WordPress 7.1

Kennst du das? Du willst auf deiner Seite mehrere Informationen kompakt nebeneinander anbieten – etwa Produktdetails, FAQs oder einen Funktionsvergleich – und landest am Ende doch wieder bei einem Tabs-Plugin, nur weil WordPress (*) von Haus aus keine Tabs kann. Damit ist jetzt Schluss. Mit WordPress (*) 7.1, das am 19. August 2026 erschienen ist, bekommst du einen waschechten Core-Block für Tabs – kein Plugin, keine zusätzliche Abhängigkeit, einfach eingebaut.

Ich zeige dir, was der neue Tabs-Block kann, wie er aufgebaut ist und worauf du beim Einsatz achten solltest.

Warum das ein echter Fortschritt ist

Bisher musstest du für Tabs auf Drittanbieter-Plugins oder Block-Sammlungen zurückgreifen – mit allen bekannten Nachteilen: zusätzlicher Code auf deiner Seite, potenzielle Sicherheitslücken, Kompatibilitätsprobleme bei Updates und oft auch schlechtere Performance. Der neue Core-Tabs-Block macht dich davon unabhängig. Übrigens ist er nicht allein unterwegs: WordPress (*) 7.1 bringt zeitgleich auch einen Playlist-Block für Audio-Inhalte mit – beide Blöcke waren zuvor typische „Plugin-only“-Funktionen und sind jetzt Teil des Cores.

Wie der Block aufgebaut ist

Technisch besteht der Tabs-Block aus drei Ebenen:

• Tabs – der äußere Container, der alles zusammenhält
• Tab List – die klickbare Navigation, über die du zwischen den Reitern wechselst
• Tab Panel – jeweils ein einzelner Inhaltsbereich, der zu genau einem Tab gehört

Wenn du einen Tab hinzufügst, erstellt WordPress automatisch ein passendes Panel dazu – Beschriftung und Inhalt bleiben also synchron. Praktisch: In der finalen Version kannst du Tabs direkt über die Toolbar auch neu anordnen, ohne sie löschen und neu erstellen zu müssen.

In die Panels kommt (fast) alles

Jedes Tab-Panel verhält sich wie ein ganz normaler Block-Container. Das heißt: Du kannst darin beliebige andere Blöcke platzieren – Bilder, Absätze, Spalten, Buttons, Listen, Videos und mehr. Damit eignet sich der Tabs-Block nicht nur für einfache Textabschnitte, sondern auch für komplexere Layouts wie Preistabellen, Produktspezifikationen, Dokumentationen oder ganze FAQ-Bereiche.

Barrierefreiheit von Anfang an mitgedacht

Ein Detail, das mir besonders gut gefällt: Der Block folgt konsequent den ARIA-Standards (genauer: dem W3C ARIA Authoring Practices Guide) für Tab-Interfaces. Das bedeutet konkret:

• Die Navigation lässt sich vollständig per Tastatur bedienen (Pfeiltasten zum Wechseln zwischen Tabs)
• Screenreader erkennen automatisch, welcher Tab aktiv ist und welches Panel dazugehört
• Nutzer:innen, die keine Maus verwenden können oder wollen, sind nicht ausgeschlossen

Barrierefreiheit ist hier also kein nachträglicher Zusatz, sondern von vornherein Teil der technischen Umsetzung.

Design ohne eine Zeile CSS

Über die Seitenleiste im Editor kannst du Farben, Abstände, Rahmen und Typografie der Tabs anpassen – ganz ohne eigenes CSS. Das lässt sich sowohl auf der Ebene der gesamten Tab-Navigation als auch für einzelne Panels separat steuern, du hast also feine Kontrolle darüber, wie unterschiedlich (oder einheitlich) deine Tabs am Ende aussehen.

Das Sahnehäubchen: Responsives Styling

Richtig stark wird der Tabs-Block in Kombination mit einer weiteren großen Neuerung aus WordPress 7.1: den responsiven Style-Einstellungen. Damit kannst du für Tablet- und Mobilansicht eigene Werte definieren – zum Beispiel eine andere Schriftgröße oder andere Abstände –, ohne dass sich das auf die Desktop-Darstellung auswirkt. Für Tabs ist das besonders wertvoll, weil eine Navigation, die am Desktop gut aussieht, auf dem Smartphone schnell zu eng oder unübersichtlich wird. Jetzt kannst du das gezielt gegensteuern.

Fazit

Der neue Tabs-Block ist ein gutes Beispiel dafür, wie WordPress mit 7.1 Funktionen ins Core-System holt, die vorher fest in Plugin-Hand waren. Du sparst dir eine Abhängigkeit, bekommst ein durchdachtes, barrierefreies Bauteil und kannst es dank responsivem Styling direkt für alle Bildschirmgrößen fein abstimmen. Wenn du bislang ein Tabs-Plugin genutzt hast: Ein Wechsel lohnt sich – beachte nur, dass bereits bestehende Plugin-Tabs nicht automatisch in den neuen Core-Block umgewandelt werden. Du müsstest sie manuell neu aufbauen.

---

Wie die Tabs genutzt werden können, seht ihr unten in einem Beispiel

---

(*) Hinweis: Hinter einigen Links stehen Affiliate-Programme. Für Sie bleibt der Preis exakt derselbe, wir erhalten jedoch eine kleine Provision, die wir direkt in unsere kommenden Recherchen investieren. Vielen Dank, dass Sie unsere Arbeit auf diese Weise unterstützen!

Views: 1