,

Hinzufügen einer Umschalttaste zu Ihrer WordPress-Website

Fassen Sie diesen Beitrag mit AI zusammen

Wie man einen Toggle-Button in WordPress hinzufügt

Möchten Sie Ihren Nutzern eine schnelle und saubere Möglichkeit bieten, zwischen verschiedenen Inhalten oder Preisoptionen auf Ihrer WordPress-Website zu wechseln? Eine Umschalttaste ist die perfekte Lösung!

Mit einer Umschalttaste können Besucher sofort zwischen zwei oder mehr Optionen wechseln, z. B. zwischen monatlichen und jährlichen Preisen, hellem und dunklem Modus oder sogar völlig unterschiedlichen Inhaltsbereichen, ohne dass Ihre Seite unübersichtlich wird.

In diesem Beitrag erfahren Sie, wie Sie auf einfache Weise Schaltflächen zu Ihrer WordPress-Website hinzufügen können:

Lasst uns eintauchen!


Methode 1: Hinzufügen einer Umschalttaste für jede Art von Inhalt

Wenn Sie Ihre Nutzer zwischen verschiedenen Inhaltsblöcken wechseln lassen wollen - wie FAQs, Produktdetails oder unterschiedliche Funktionen benötigen, ist diese Methode die richtige für Sie.

Wir verwenden die Ultimative Blöcke Plugin, das einen vielseitigen Content Toggle (Tabbed Content) Block bietet, der für alle Arten von Inhalten geeignet ist.

Schritt 1: Ultimate Blocks Plugin installieren

  • Gehen Sie zu Ihrem WordPress-Dashboard.
  • Navigieren Sie zu Plugins > Neu hinzufügen.
  • Suchen Sie nach "Ultimate Blocks" und installieren/aktivieren Sie es.
Ultimate Blocks Plugin installieren

Schritt 2: Hinzufügen des Inhaltsblocks mit Registerkarten

  • Öffnen Sie einen Beitrag oder eine Seite im WordPress-Editor.
  • Typ /Registerkarteninhalt oder verwenden Sie das +-Symbol, um den Block "Registerkarteninhalt" hinzuzufügen.
Inhaltsblock mit Registerkarte hinzufügen

Der Block "Tabbed Content" sieht dann so aus -

Ursprüngliche Schnittstelle des Blocks

Schritt 3: Anpassen des Blocks für die Umschaltfunktionalität

Markieren Sie den Block und wählen Sie die Option Pillen-Stil in den Einstellungen (dadurch sehen die Registerkarten wie Schaltflächen aus).

Gehen Sie zu den Einstellungen und wählen Sie den Stil Pills

Zentrieren Sie die Ausrichtung für einen klassischen Toggle-Look.

Ausrichtung des Blocks anpassen

Klicken Sie auf die + Vorzeichen neben der ersten Registerkarte, um eine weitere Registerkarte hinzuzufügen. Fügen Sie mindestens zwei Registerkarten hinzu (z. B. "Monatlich" und "Jährlich" oder "Details" und "Zusammenfassung"). Benennen Sie die Registerkarten so um, dass sie Ihren Umschaltoptionen entsprechen.

Weitere Registerkarte hinzufügen

Verwenden Sie die Farbeinstellungen, um kontrastierende Farben festzulegen, damit klar ist, welche Registerkarte aktiv ist.

Benennen Sie die Registerkarten um und verwenden Sie die Farbeinstellungen

Schritt 4: Fügen Sie Ihren Inhalt hinzu

Klicken Sie auf die einzelnen Registerkarten, um den gewünschten Inhalt hinzuzufügen (Text, Bilder, Listen, Formulare oder sogar andere Blöcke).

Inhalt zu den Registerkarten hinzufügen

Bei Bedarf können Sie weitere Anpassungen vornehmen: Ändern Sie den Hintergrund der Registerkarten, die Farben des Inhalts und vieles mehr.

Registerkarten anpassen

Schritt 5: Vorschau und Veröffentlichung

  • Verwenden Sie die Option Vorschau, um die Umschaltfunktion zu testen.
  • Wenn Sie zufrieden sind, veröffentlichen oder aktualisieren Sie die Seite.
Vorschau und Veröffentlichung

Das war's! Sie haben jetzt eine flexible Umschalttaste für jede Art von Inhalt auf Ihrer WordPress-Website.


Methode 2: Hinzufügen einer Umschalttaste für Preistabellen (und mehr)

Möchten Sie den Nutzern die Möglichkeit geben, zwischen monatlichen und jährlichen Preistabellen umzuschalten - oder verschiedene Datensätze nebeneinander zu vergleichen? Die Umschaltbar für Tableberg Block im Tableberg-Plugin ist genau dafür gedacht!

Mit Tableberg Prokönnen Sie eine beliebige Anzahl von Tabellen in übersichtlichen, anklickbaren Registerkarten organisieren - perfekt für Preispläne, Produktvergleiche, mehrsprachige Tabellen oder andere Szenarien, in denen mehrere Tabellen sinnvoll sind.

Schritt 1: Einfügen des 'Toggle for Tableberg' Blocks

  • Öffnen Sie Ihren Beitrag oder Ihre Seite im WordPress-Editor.
  • Klicken Sie auf das Pluszeichen (+) und suchen Sie nach "Toggle for Tableberg".
  • Fügen Sie den Block zu Ihrer Seite hinzu.

Schritt 2: Einrichten und Anpassen der Registerkarten

  • Standardmäßig sehen Sie drei Registerkarten mit den Bezeichnungen "Register 1", "Register 2" und "Register 3".
  • Mit den Symbolen + und - können Sie nach Bedarf Registerkarten hinzufügen oder entfernen.
  • Benennen Sie die einzelnen Registerkarten um (z. B. "Monatlich", "Jährlich" oder "Basic Plan", "Pro Plan").
  • Verwenden Sie das Optionsfeld auf der rechten Seite, um die Titel, die Ausrichtung, die Farben und die Ränder der Registerkarten anzupassen und so ein individuelles Erscheinungsbild zu schaffen.

Schritt 3: Fügen Sie Ihre Tabellen hinzu

  • Klicken Sie auf jede Registerkarte, um eine eigene Tabelle hinzuzufügen.
  • Erstellen Sie eine neue Tabelle von Grund auf, oder fügen Sie ein vorgefertigtes Tableberg-Tabellenmuster ein.
  • Jede Registerkarte kann eine völlig andere Tabelle enthalten - ideal für Funktionsvergleiche, Preisstufen, Datensätze und mehr.

Beliebte Anwendungsfälle

  • Preistabellen: Lassen Sie die Nutzer zwischen monatlichen und jährlichen Preisen oder zwischen verschiedenen Tarifen umschalten.
  • Datenvergleiche: Zeigen Sie regionale Daten, verschiedene Produktspezifikationen oder Leistungskennzahlen auf separaten Registerkarten an.
  • Pädagogischer Inhalt: Organisieren Sie Lektionen oder Kursmaterial zur leichteren Navigation.
  • Mehrsprachige Tabellen: Zeigen Sie dieselben Daten in verschiedenen Sprachen für internationale Besucher an.

Schritt 4: Vorschau und Veröffentlichung

  • Vergewissern Sie sich in der Vorschau, dass die Registerkarten wie erwartet aussehen und funktionieren.
  • Veröffentlichen oder aktualisieren Sie Ihren Beitrag/Ihre Seite, wenn Sie fertig sind.

Hier ist ein Beispiel dafür, wie der Toggle für eine Preistabelle aussieht.


Schlussfolgerung

Das Hinzufügen einer Umschalttaste zu Ihrer WordPress-Website ist eine großartige Möglichkeit, die Navigation zu verbessern, Platz zu sparen und den Besuchern sofortigen Zugriff auf die Inhalte zu geben, die sie interessieren - egal, ob sie zwischen Preisplänen wechseln, Details anzeigen oder Daten vergleichen möchten.

  • Für jede Art von Inhalt, verwenden Sie Ultimative Blöcke um in Sekundenschnelle flexible Kippschalter zu erstellen.
  • Für Preistabellen und fortgeschrittene Tabellenlayouts versuchen Sie Tableberg Pro's Toggle-Block für ein nahtloses Erlebnis mit Registerkarten.

Probieren Sie diese Methoden auf Ihrer Website aus und machen Sie Ihre Inhalte interaktiver und benutzerfreundlicher. Haben Sie Fragen oder brauchen Sie Hilfe? Lassen Sie es uns in den Kommentaren wissen!



Das Tischberg-Team

Erstellen Sie schöne WordPress-Tabellen - visuell!

Verabschieden Sie sich von langweiligen Tabellen. Mit Tableberg können Sie reaktionsschnelle, interaktive Tabellen mit dem Block-Editor erstellen - ganz ohne Code.

Tableberg Schnittstelle
🛒 Neu: Erstellen Sie schöne WooCommerce Produkttabellen!
Dies ist der Standardtext für die Benachrichtigungsleiste