Möchten Sie Ihre WordPress-Seiten übersichtlicher gestalten? Eine meiner Lieblingsmethoden ist die Erstellung von Registerkarten in WordPress. Das schafft Ordnung, spart Platz und sieht auf jedem Gerät gut aus.
Registerkarten funktionieren wie kleine Ordner direkt auf der Seite. Besucher können durch Anklicken genau die Informationen aufrufen, die sie benötigen, ohne zu scrollen oder die Seite zu überladen.
In diesem Leitfaden zeige ich Ihnen Schritt für Schritt, wie Sie in WordPress Tabbed Content erstellen können, ohne eine einzige Zeile Code zu schreiben. Ich zeige Ihnen meine bewährte Methode mit SeedProd sowie ein kostenloses Plugin, falls Sie nach einer schnellen Alternative suchen.
Schnelle Schritte zur Erstellung von Registerkarteninhalten:
Was sind Tabs in WordPress?
Registerkarten sind eine Art Navigationssystem, das den Inhalt organisiert und es den Besuchern erleichtert, Ihre Website zu durchsuchen. Sie können Registerkarten zu Beiträgen und Seiten hinzufügen oder ein Registerkarten-Widget verwenden, um Inhalte mit Registerkarten in Ihrer WordPress-Seitenleiste und in Widget-Bereichen anzuzeigen.
Warum brauchen Sie WordPress-Inhalte mit Registerkarten?
Neben der Sortierung der Inhalte machen es Registerkarten viel einfacher, Ihre Website-Besucher aktiv und engagiert zu halten. Da Registerkarten die Themen auf einer Seite zusammenfassen, müssen die Nutzer nicht auf andere Seiten klicken, was ideal für kürzere Aufmerksamkeitsspannen ist.
WordPress.org verwendet beispielsweise Registerkarten auf seiner Plugin-Seite, um Informationen wie Details, Bewertungen, Support und Entwicklung anzuzeigen.
Beliebte Möglichkeiten zur Verwendung von Tabs in WordPress:
- Produktspezifikationen und -bewertungen auf WooCommerce-Seiten
- Kontaktinformationen nach Abteilung oder Standort
- Blog-Filter (beliebt, aktuell, Kategorien)
- FAQ-Abschnitte mit separaten Registerkartenkategorien
- Preisschichten oder Dienstleistungspakete
Profi-Tipp: Registerkarten sind nicht mit Akkordeons zu verwechseln. Benutzer klicken auf Registerkarten, um Informationen zu wechseln, während sich Akkordeons ausdehnen, um Informationen anzuzeigen.
Wie man Tabs in WordPress mit SeedProd erstellt (ohne Code)
Für die erste Methode werden wir SeedProd, den besten WordPress-Website-Builder, verwenden, um Ihrer Website Registerkarteninhalte hinzuzufügen.
SeedProd ist ein leistungsstarker Drag-and-Drop-Seitenersteller, mit dem Sie flexible WordPress-Layouts erstellen können, ohne Code zu schreiben. Mit seinen professionellen Website-Kits, Landing-Page-Vorlagen und dem visuellen Live-Editor können Sie jeden Teil Ihrer Website anpassen und die Änderungen in Echtzeit sehen.
Sie können SeedProd auch verwenden, um:
- Benutzerdefinierte WordPress-Themes erstellen
- Erstellen von WooCommerce-Websites
- Erstellen von Landing Pages mit hoher Konversionsrate
- Versetzen Sie Ihre Website in den Wartungsmodus
- Und vieles mehr
Dieser Page Builder enthält auch hochgradig anpassbare Blöcke, mit denen Sie Ihr WordPress-Design verbessern können. Mit dem Tabs-Block, den wir in dieser Anleitung verwenden, können Sie beispielsweise mit wenigen Klicks mehrere Tabs zu Seiten hinzufügen.
Folgen Sie den nachstehenden Schritten, um mit SeedProd Tabs in WordPress zu erstellen.
Video-Anleitung
Wenn Sie es vorziehen, können Sie auch die unten aufgeführten Schritte befolgen.
Schritt 1. SeedProd Website Builder installieren
Zunächst müssen Sie auf die SeedProd-Website gehen und das Plugin herunterladen. SeedProd hat eine kostenlose Version; Sie benötigen jedoch einen Premium-Plan, um Registerkarten und andere Blöcke freizuschalten.
Sobald Sie das Plugin heruntergeladen haben, müssen Sie es auf Ihrer WordPress-Website installieren und aktivieren. Sie können diese Anweisungen zur Installation eines WordPress-Plugins befolgen, wenn Sie dies noch nie getan haben.
Nachdem Sie das Plugin aktiviert haben, navigieren Sie zu SeedProd " Einstellungen und geben Ihren Plugin-Lizenzschlüssel ein.
Sie finden Ihren SeedProd-Lizenzschlüssel in Ihrem Konto-Dashboard unter der Rubrik Downloads.
Vergessen Sie nicht, auf die Schaltfläche Schlüssel überprüfen zu klicken, bevor Sie zum nächsten Schritt übergehen.
Schritt 2. Erstellen Sie ein WordPress-Theme oder eine Landing Page
Es gibt 2 Möglichkeiten, SeedProd zum Hinzufügen von Registerkarten zu Ihrer Website zu verwenden:
- Verwenden Sie den Theme Builder, um ein benutzerdefiniertes WordPress-Theme zu erstellen, und fügen Sie Tabs zu jeder WordPress-Seite hinzu.
- Erstellen Sie mit dem Drag-and-Drop-Seitenerstellungsprogramm eine eigenständige Landing Page mit Registerkarteninhalten.
In dieser Anleitung verwenden wir die erste Option, weil Sie damit Tabs zu jeder beliebigen Seite hinzufügen können, einschließlich Ihrer Homepage, der WordPress-Seitenleiste, der Kopfzeile, der Fußzeile und an jeder anderen Stelle in Ihrem Theme.
Sie können dieser Schritt-für-Schritt-Anleitung folgen, um ein WordPress-Theme mit SeedProd zu erstellen, und dann hierher zurückkehren, um Anweisungen zum Hinzufügen von Registerkarten zu Ihrer Website zu erhalten.
Schritt 3. Hinzufügen von Tabs zu Ihren WordPress-Seiten
Nachdem Sie Ihr WordPress-Theme erstellt haben, müssen Sie entscheiden, welche Seiten mit Registerkarten ausgestattet werden sollen. So könnten Sie beispielsweise auf Ihrer Kontaktseite Registerkarten hinzufügen, um verschiedene Arten von Kontaktinformationen anzuzeigen, oder in einer benutzerdefinierten Seitenleiste für verschiedene Beitragskategorien.
In diesem Beispiel fügen wir der Info-Seite Registerkarten hinzu, um weitere Details wie offene Stellen, redaktionelle Richtlinien und mehr anzuzeigen.
Gehen Sie dazu in Ihrer WordPress-Verwaltung auf Seiten " Alle Seiten und suchen Sie die Seite, die Sie bearbeiten möchten.
Da Sie ein SeedProd-Website-Kit verwenden, werden Inhaltsseiten wie die Seiten "Über", "Kontakt" und "Dienstleistungen" automatisch erstellt. Um sie im visuellen Editor zu öffnen, klicken Sie auf den Link Mit SeedProd bearbeiten.
Sobald Ihre Seite im Page Builder geöffnet ist, können Sie die Anpassungsoptionen von SeedProd nutzen, um Änderungen vorzunehmen. Sie können auf jedes Element klicken, um seinen Inhalt, seine Farben, sein Styling und seine Sichtbarkeit zu ändern.
Es ist auch einfach, weitere Elemente zu Ihrer Seite hinzuzufügen, indem Sie sie aus dem Blockbedienfeld ziehen und an ihrem Platz ablegen. Tun wir das mit dem Tab-Block von SeedProd.
Fügen Sie der Seite zunächst einen neuen Abschnitt hinzu, in dem Sie Ihre Registerkarteninhalte unterbringen. In unserem Fall duplizieren wir einen der vorhandenen Abschnitte und ziehen ihn an den unteren Rand der Seite.
Tauschen Sie dann das Bild gegen ein passenderes aus und löschen Sie nicht mehr benötigte Inhalte, indem Sie auf das Mülleimer-Symbol klicken.
Jetzt können Sie im linken Bereich nach dem Block Registerkarten suchen und ihn in den neuen Abschnitt Ihrer Seite ziehen.
Wenn Sie auf den Block klicken, werden seine Inhaltseinstellungen angezeigt, wo Sie die Möglichkeit haben:
- Mehrere Registerkarten hinzufügen
- Das Registerkartensymbol ein- oder ausblenden
- Ändern Sie die Schriftgröße
- Vergrößern oder verkleinern Sie den Abstand zwischen Tabulatoren
- Anpassen der Tabulatorausrichtung
Wenn Sie die einzelnen Registerkarten aufklappen, können Sie einen Registertitel hinzufügen und Ihren Inhalt mit einem klassischen Editor mit WYSIWYG-Einstellungen (what you see is what you get) schreiben.
Sie können auch ein benutzerdefiniertes Symbol aktivieren, um Ihre Tabs interessanter zu machen und sie hervorzuheben. Schalten Sie einfach den Schalter "Tab-Symbol ausblenden" auf "Aus" und wählen Sie ein benutzerdefiniertes Symbol aus der Font Awesome-Bibliothek.
Wenn Sie auf die Registerkarte Erweitert klicken, können Sie weitere Anpassungsoptionen auswählen, z. B. benutzerdefinierte Hintergrundfarben, Schriftarten, Rahmen, Abstände und mehr.
Sie können auch vertikale Registerkarten oder einen horizontalen Registerkartensatz anzeigen, indem Sie auf eine der beiden Layoutoptionen klicken.
Vergessen Sie nicht, auf die Schaltfläche Speichern in der oberen rechten Ecke des Bildschirms zu klicken, um Ihre Änderungen zu speichern.
Führen Sie die gleichen Schritte aus, um Tabs zu jeder anderen Seite Ihrer WordPress-Website hinzuzufügen, und gehen Sie dann zum nächsten Schritt über, um Ihre Änderungen live zu schalten.
Schritt 4. Veröffentlichen Sie Ihre Registerkarteninhalte
Nachdem Sie Ihren verschiedenen WordPress-Seiten Registerkarten hinzugefügt haben, können Sie sie für die Besucher Ihrer Website veröffentlichen.
Gehen Sie dazu auf die Seite SeedProd " Theme Builder und schalten Sie den Schalter "Enable SeedProd theme" auf "On".
Jetzt können Sie Ihre Seiten in der Vorschau anzeigen und Ihre Registerkarteninhalte in Aktion sehen.
Wie man mit einem kostenlosen Plugin Tabs in WordPress hinzufügt
Die folgende Methode ist eine gute Alternative, wenn Sie Ihr WordPress-Theme nicht ändern oder eine Landing Page erstellen möchten. Wir verwenden das kostenlose Tabs Responsive WordPress-Plugin, um Ihrer WordPress-Website responsive Tabs hinzuzufügen.
Als erstes müssen Sie das Tabs Responsive Plugin installieren und es in Ihrem WordPress-Admin aktivieren.
Navigieren Sie dann zu Registerkarten Responsive " Neue Registerkarten hinzufügen und geben Sie Ihrem Registersatz einen Titel.
Von dort aus können Sie die Standardvorlage auswählen, oder wenn Sie die Pro-Version verwenden, können Sie aus mehr als 18 Vorlagenstilen wählen.
Der nächste Schritt ist das Hinzufügen Ihrer Registerkarten. Sie können so viele Registerkarten erstellen, wie Sie möchten und einschließen:
- Registerkarten-Titel
- Registerkarten-Beschreibungen
- Registerkarten-Symbole
Sie können auch das Design der einzelnen Registerkarten in der rechten Seitenleiste bearbeiten, indem Sie benutzerdefinierte Registerkartenstile, Hintergrundfarben, Schriftfarben und mehr auswählen.
Wenn Sie mit Ihren Tabs zufrieden sind, kopieren Sie den Tabs-Shortcode und fügen ihn an einer beliebigen Stelle in Ihr WordPress-Theme ein.
Sie können den Shortcode zum Beispiel wie folgt in einen WordPress-Beitrag oder eine Seite einfügen:
So wird es auf der Vorderseite Ihrer Website aussehen:
Sie können den Tabs-Shortcode auch in einen Widget-bereiten Bereich einfügen, z. B. in Ihre WordPress-Sidebar oder Footer-Widgets, indem Sie den Shortcode in einen Absatzblock einfügen.
Danach werden die Inhalte auf den Registerkarten in den Bereichen der Seitenleiste angezeigt:
Welche Methode ist die beste für die Erstellung von Registerkarten?
Wenn Sie die volle Designkontrolle wünschen und bereits SeedProd verwenden, ist die Drag-and-Drop-Methode am besten geeignet. Sie ist schnell, visuell und funktioniert mit Ihrem bestehenden Theme oder Ihren Landing Pages. Wenn Sie ein klassisches Theme verwenden und eine schnelle Möglichkeit zum Einfügen von Registerkarten wünschen, ist das Tabs Responsive Plugin eine solide kostenlose Option.
Wie erstellt man Tabs in WordPress FAQs
Ja, es ist möglich, benutzerdefinierte Registerkarteninhalte zu erstellen, ohne ein Plugin zu verwenden. Allerdings sind dafür in der Regel Kenntnisse in HTML, CSS und JavaScript erforderlich. Sie müssen den erforderlichen Code schreiben, um die Funktionalität der Registerkarten zu implementieren und sie nach Ihren Wünschen zu gestalten.
Ja, Sie können in jeder Registerkarte verschiedene Arten von Inhalten anzeigen. Dies kann Text, Bilder, Videos, Tabellen, Formulare oder andere HTML-unterstützte Inhalte umfassen. Die meisten Plugins für Registerkarteninhalte bieten Optionen zum Hinzufügen und Formatieren verschiedener Inhaltstypen innerhalb jeder Registerkarte.
Ja, Plugins für Registerkarteninhalte sind in der Regel responsiv und mobilfreundlich gestaltet. Sie passen das Layout und das Verhalten der Registerkarten und des Registerkarteninhalts automatisch an, um eine optimale Anzeige und Benutzerfreundlichkeit auf verschiedenen Geräten, einschließlich Smartphones und Tablets, zu gewährleisten.
Ja, Registerkarten können eine effektive Möglichkeit sein, Produktinformationen oder Preispläne zu organisieren und anzuzeigen. Sie können Registerkarten für verschiedene Produktmerkmale, Spezifikationen, Preisstufen oder andere relevante Details erstellen, so dass die Nutzer leicht zwischen den Informationen wechseln können, die sie interessieren.
Sie können Ihrer WordPress-Website mit nur wenigen Klicks elegante, anpassbare Registerkarten hinzufügen, ohne dass Code erforderlich ist. SeedProd macht den Prozess schnell und anfängerfreundlich, vor allem, wenn Sie bereits den Page Builder verwenden.
Sind Sie bereit, anpassbare Registerkarten für Ihre Website zu erstellen?
Vielleicht gefallen Ihnen auch diese anderen hilfreichen WordPress-Leitfäden, während Sie hier sind:
- Wie man Textanimationen in WordPress erstellt (einfache Schritte)
- Wie man ausgefallene Sektionsteilungen für WordPress-Websites erstellt
- Hinzufügen einer Autorenbox in WordPress (ohne Plugin)
- Wie man in WordPress eine andere Seitenleiste für verschiedene Seiten hinzufügt
Vielen Dank fürs Lesen! Wir würden uns freuen, Ihre Meinung zu hören. Bitte beteiligen Sie sich an der Konversation auf YouTube, X und Facebook, um weitere hilfreiche Ratschläge und Inhalte für das Wachstum Ihres Unternehmens zu erhalten.
