So entwerfen Sie WordPress-Toggle-Inhalte in Elementor

Wie lassen sich Inhalte am besten anzeigen, die mehrere Abschnitte haben oder Optionen bieten?

Beispielsweise kann eine Preisseite verschiedene Arten von Preisschemata enthalten, z. B. monatliche, jährliche und lebenslange Angebote. Die Anzeige all dieser Angebote auf einer Seite kann für Kunden problematisch sein. Sie müssen weit nach unten scrollen, um den Inhalt zu konsumieren.

Wie sortieren Sie dies also, um die Seite sauber und minimalistisch zu gestalten und gleichzeitig alle erforderlichen Informationen und Inhalte beizubehalten?

Hier hilft das Umschalten von Inhalten. Es ermöglicht Ihnen, interaktive Inhalte mit einer intelligenten Benutzeroberfläche zu erstellen. 

Wenn es um WordPress geht, gibt es viele Möglichkeiten, Toggle-Inhalte zu erstellen. Der einfachste Weg ist jedoch Elementor. Dieser Artikel führt Sie durch die Schritte zum Erstellen von WordPress-Toggle-Inhalten mit Elementor.

Was ist Toggle-Inhalt?

Mit der Umschaltfunktion kann der Benutzer die Sichtbarkeit von Inhalten auf einer Webseite steuern. Inhalte umschalten wird normalerweise auf Websites verwendet, um verschiedene Versionen oder Abschnitte des Inhalts anzuzeigen.

Beim Umschalten des Inhalts ist nur ein Teil des Inhalts im Ansichtsfenster sichtbar, während andere unter einer Registerkarte oder einem Titel angezeigt werden. Wenn Benutzer auf eine Registerkarte klicken, ist nur der Inhalt darunter sichtbar.

Beispielsweise eine Preisseite mit zwei Preisangeboten, einem monatlichen und einem jährlichen. Wenn Sie einen Umschaltinhalt verwenden, wird nur eines der Angebote, entweder Monats- oder Jahresangebote, auf dem Bildschirm angezeigt. 

Wenn der Benutzer auf die Registerkarte „Monat“ klickt, werden die monatlichen Angebote angezeigt. Ebenso werden beim Öffnen der Registerkarte „Jahresangebot“ die Jahresangebote angezeigt.

Eine Schritt-für-Schritt-Anleitung zum Erstellen erweiterter Elementor-Toggle-Inhalte in WordPress

Obwohl es viele WordPress-Umschalt-Plugins gibt, ist ElementsKit der einfachste Weg, eine erweiterte Elementor-Umschaltschaltfläche in WordPress zu erstellen!

Das Advanced Toggle-Widget von ElementsKit fügt Ihrem WordPress-Toggle-Inhalt zusätzliche Funktionalität hinzu. Mit der größtmöglichen Anzahl an anpassbaren Optionen können Sie Inhalte stilvoller anzeigen.

So können Sie mit dem Advanced Toggle-Widget von ElementsKit anspruchsvolle WordPress-Toggle-Inhalte erstellen:

Schritt 1: Wählen Sie Stile für die Elementor-Umschalttaste

Um das erweiterte Umschalt-Widget zu verwenden, ziehen Sie das Widget zunächst per Drag & Drop in Ihr Elementor-Design. Anschließend können Sie Toggle-Inhalte einrichten und deren Stile anpassen.

Das ElementsKit Advanced Toggle-Widget verfügt über zwei verschiedene Arten von Schaltflächen. Nicht nur die Stile sind unterschiedlich, auch ihre Funktionalitäten sind unterschiedlich. 

Mit Stil 1 können Sie mehrere Registerkarten anzeigen. Unter diesen Registerkarten können Sie umschaltbare Inhalte hinzufügen. Wenn Sie mehrere Optionen anzeigen möchten, können Sie diesen Stil auswählen.

Stil 2 besteht darin, mit einer herkömmlichen Umschalttaste zwischen zwei Inhalten zu wechseln. Wenn Sie diesen Stil wählen, Es werden nur die ersten beiden Registerkarten angezeigt. Es erscheint eine typische Umschalttaste, die zwischen den beiden Inhalten wechselt. 

Für dieses Tutorial verwenden Sie Stil 1, um Ihnen weitere anpassbare Optionen zu zeigen.

Schritt 2: Fügen Sie Tabs zum Umschaltmenü in WordPress hinzu

Mithilfe des ElementsKit Advanced-Umschalt-Widgets können Sie Registerkarten mit nur einem Klick hinzufügen. Um eine neue Registerkarte hinzuzufügen, klicken Sie auf die Schaltfläche ELEMENT HINZUFÜGEN. Für jeden Tab-Inhalt können Sie festlegen Titel, Hintergrundfarbe des Indikators, Titelfarbe für Normal und Hover-Effekt für jede Registerkarte einzeln. Wenn Sie eine Registerkarte außerdem standardmäßig sichtbar machen möchten, können Sie dies aktivieren Lassen Sie diese Registerkarte geöffnet Besonderheit.

Außerdem können Sie das einstellen Ausrichtung für Tabs nach rechts, links oder in die Mitte umschalten. Die Option dazu Aktivieren Sie Ajax ist auch vorhanden.

Schritt 3: Wie füge ich WordPress-Toggle-Inhalte in Elementor hinzu?

Der Prozess der Inhaltserstellung macht dies zu einem „Fortschrittlich” Widget umschalten. Sie können buchstäblich Inhalte für jede Registerkarte entwerfen, ohne den Elementor-Editor zu verlassen. Dies bietet einen großen Vorteil, da Sie den Inhalt auf derselben Seite erstellen und anpassen können, auf der Sie die Umschaltfläche bearbeiten.

Um den Toggle-Inhalt zu erstellen, Klicken Sie auf den Inhaltsbereich unter der Umschalttaste. A Widget-Bereich wird auf Ihrem Bildschirm angezeigt. In dieser Schnittstelle können Sie Toggle-Inhalte mit allen Elementor- und ElementsKit-Elementen entwerfen. Du hast die Option zu Erstellen Sie Ihr eigenes Design oder Verwenden Sie gespeicherte Vorlagen. Außerdem können Sie das nutzen ElementsKit-Vorlagenbibliothek um großartige WordPress-Toggle-Inhalte zu erstellen.

Schritt 4: Passen Sie die Elementor-Umschalttaste mit ElementsKit an

Das Anpassen der Elementor-Umschalttaste ist mit ElementsKit einfach und flexibel. Im Containerbereich wechseln (Unter der Registerkarte „Stil“) können Sie Folgendes auswählen Hintergrundtyp für Umschalttasten, dann einstellen Polsterung, Box Schatten Stil und Grenzradius.

Für die Kippschaltersind auch Optionen zum Festlegen des Randradius und des Rahmenschattens verfügbar.

Darüber hinaus in der Inhalt Abschnitt können Sie festlegen Typografie für die Titel der Umschaltregisterkarten.

Das ist es! Der Toggle-Inhalt ist nun fertig. Sie können jetzt den Umschaltinhalt hinzufügen, um Ihr Webdesign stilvoller und dynamischer zu gestalten.

Um mehr zu erfahren, lesen Sie die vollständige Dokumentation unter wie man das ElementsKit Advanced Toggle-Widget verwendet.

Warum sollten Sie ElementsKit zum Erstellen der Elementor-Umschalttaste wählen?

Eine sehr berechtigte Frage, die Sie vielleicht stellen, ist: unter allen verfügbaren WordPress-Toggle-Plugins, warum sollten Sie sich für ElementsKit entscheiden? Die Antwort in einer Zeile wäre: Es handelt sich um das erweiterte Umschalt-Widget mit allen erweiterten Funktionen.

Um es näher zu erläutern: ElemensKit verfügt über eine erweiterte Funktion zur Inhaltserstellung. Die meisten Elementor-Umschalt-Widgets bieten die Möglichkeit, nur zwischen zwei Inhalten umzuschalten. Mit ElementsKit hingegen können Sie beliebig viele Toggle-Inhalte mit einem bestimmten Stil erstellen. Darüber hinaus können Sie im selben Editor eine Elementor-Umschaltschaltfläche und den Umschaltinhalt erstellen. Das macht die Erstellung von WordPress-Toggle-Inhalten einfacher als je zuvor. Außerdem können Sie auch vorgefertigte Vorlagen verwenden.

Hier erfahren Sie, warum Sie wählen sollten ElementsKit Erweitertes Toggle-Widget So erstellen Sie WordPress-Toggle-Inhalte in Elementor:

• Erweiterte Inhaltserstellung.
• Fügen Sie eine unbegrenzte Anzahl von Toggle-Inhalten hinzu.
• Erstellen Sie eine Umschaltschaltfläche und entwerfen Sie Umschaltinhalte an einem Ort, ohne den Editor verlassen zu müssen.
• Entwerfen Sie anspruchsvolle Toggle-Inhalte mit Elementor.
• Macht den Abschnitt für Benutzer interaktiv.
• Reduziert die Scrollzeit, um das Engagement zu verbessern.

Kurzgesagt

WordPress-Toggle-Inhalte sind eine großartige Möglichkeit, das Benutzererlebnis auf Ihrer Website zu verbessern. Mithilfe von Umschaltern können Sie das Erscheinungsbild Ihrer Website ändern und sie interaktiver gestalten. 

Beim Erstellen von Toggle-Inhalten bietet ElementsKit die flexibelsten und fortschrittlichsten Funktionen. Wenn Sie der obigen Anleitung gefolgt sind, sollten Sie problemlos eine Elementor-Umschalttaste erstellen können.