Wichtige Erkenntnisse
- Elementor hat zwei Tab-Widgets. Das ursprüngliche hat seit Version 3.8 eine Abschreibungsmitteilung, und das Nested Tabs-Widget hat es ersetzt.
- Nested Tabs stellt in jedes Panel einen Container, sodass ein Formular, eine Galerie oder eine Preistabelle in einem Tab untergebracht werden kann.
- Nested Tabs wechselt außerdem zu einem vertikalen Akkordeonlayout unterhalb eines von Ihnen gewählten Haltepunkts, dem Verhalten, das sich die meisten Menschen auf Telefonen wünschen.
- Ein Addon-Widget wie das Master Addons Tabs Widget Ist die Route, wenn der Tab-Strip selbst das Designproblem ist: Bildtitel, Stilvoreinstellungen oder das Einschalten des Hovers.
- Wählen Sie nach dem, was in das Panel passt. Widgets im Inneren bedeuten Kern. Ein gestylter Tabulatorstreifen über Text bedeutet ein Addon.
Tabs machen einen Job: eine lange Seite kurz halten Spezifikation, Lieferung und Garantie müssen nicht alle auf einmal auf dem Bildschirm sein, und ein Besucher, der eine davon haben möchte, sollte nicht an den anderen beiden vorbeiscrollen.
Elementor gibt Ihnen dafür zwei Widgets und Addons mehr, weshalb die Panelsuche nach “Tabs” verwirrend ist Diese Anleitung deckt alle drei Routen ab, was jeder halten kann und wie sie sich auf einem Telefon verhalten.
Inhaltsverzeichnis
Welches Tabs Widget Sie tatsächlich haben
Widget-Panel öffnen und nach Tabs suchen Auf einer aktuellen Elementor-Installation bekommt man das Tabs-Widget, und was man hineinzieht, ist die verschachtelte Version Das alte Widget ist noch im Code für Seiten, die es bereits verwenden, und es zeigt einen Hinweis im Panel an, wenn man eines bearbeitet: jedes neue Tabs-Widget, das man hineinzieht, wird das neue mit verschachtelten Funktionen sein Dieser Hinweis gibt es seit Elementor 3.8.
In der Praxis gibt es also drei Dinge, die Sie verwenden könnten, und sie sind nicht dasselbe.
| Widget | Was in ein Panel kommt | Woher es kommt |
|---|---|---|
| Tabs (verschachtelt) | Ein Container, also beliebige Widgets | Elementor, frei |
| Tabs (alt) | Nur Editorinhalte | Elementor, seit 3.8 veraltet |
| Addon-Tabulatoren Widget | Editorinhalt, oder eine gespeicherte Vorlage mit Pro | Master Addons und andere |
Route 1: das Nested Tabs-Widget
Dies ist die Voreinstellung und der richtige Ausgangspunkt, Ziehen Sie Tabs auf die Seite und Sie erhalten drei Tabs, die jeweils einen leeren Container halten.
- Ziehen Sie das Tabs-Widget auf die Seite.
- Benennen Sie jedes Element im Tabs-Repeater um. Der Titel ist alles, was der Repeater hält, da der Inhalt im Container lebt.
- Klicken Sie auf eine Registerkarte auf der Leinwand und bauen Sie dann wie überall sonst in den Behälter ein.
- Verwenden Sie im Layout Richtung, um den Streifen zu verschieben: Oben, Unten, Start oder Ende, wobei Start und Ende die Titel in eine Seitenspalte setzen.
- Stellen Sie in den zusätzlichen Einstellungen die horizontale Schriftrolle ein, wenn die Titel nicht passen, und legen Sie den Haltepunkt fest, an dem der Streifen zu einem Akkordeon werden soll.
Der Container ist der ganze Punkt Ein Kontaktformular, eine Galerie, eine Preistabelle oder ein Schleifenraster funktionieren alle innerhalb eines Tabs, und nichts anderes auf dieser Liste kann das tun Der Handel ist, dass der Tabstreifen selbst ziemlich einfach ist: Titel mit einem optionalen Symbol, und keine Voreinstellung, um von zu beginnen.
Route 2: ein Addon-Tabs-Widget
Addon Widgets gibt es für die andere Hälfte des Problems, wo der Streifen das Design ist Das Master Addons Widget baut jede Registerkarte aus einer Repeater-Zeile, die ihre eigenen Felder trägt.
Der Build ist:
- Ziehen Sie das Widget hinein und wählen Sie eine Stilvoreinstellung aus.
- Fügen Sie pro Registerkarte ein Repeater-Element mit einem Tab-Titel hinzu.
- Setzen Sie den Symboltyp auf Keine, Symbol oder Bild, wählen Sie dann das Symbol aus oder laden Sie das Bild hoch.
- Schreiben Sie den Panel-Inhalt in den Editor oder auf Pro Point Content Type in einen gespeicherten Abschnitt, ein Widget oder eine Seitenvorlage.
- Stellen Sie den Tab-Effekt auf Klicken oder Bewegen ein und wechseln Sie den Standardwert auf der Registerkarte, die zuerst geöffnet werden soll.
Was Sie aufgeben, ist der Container. Panels nehmen Editorinhalte, also bedeutet ein Formular innerhalb einer Registerkarte entweder die Pro-Route mit einer gespeicherten Vorlage oder das Kern-Widget.
Route 3: das alte Tabs-Widget
Wenn Sie eine Seite bearbeiten, die vor ein paar Jahren erstellt wurde, schauen Sie sich möglicherweise das ursprüngliche Widget an: einen Tabs Items-Repeater mit einem Titel und einem Inhaltsfeld sowie einen Positionskontrollelement für horizontal oder vertikal. Es funktioniert immer noch und Elementor versendet es immer noch so alte Seiten gehen nicht kaputt.
Es gibt keinen Grund damit eine neue Seite zu beginnen, wenn man schon drin ist, ist die Frage ob der Neuaufbau des Blocks als Nested Tabs die paar Minuten wert ist, und meistens ist es das auch, denn man bekommt den Akkordeon-Breakpoint und den Container.
Welche Route passt zum Job
| Was Sie brauchen | Verwenden |
|---|---|
| Ein Formular, eine Galerie oder eine Preistabelle in einer Registerkarte | Verschachtelte Tabs |
| Tabs, die auf Telefonen zu einem Akkordeon werden | Verschachtelte Tabs |
| Ein Bild auf jedem Tab-Titel | Addon-widget |
| Ein gestalteter Streifen ohne Styling von Grund auf | Addon-Widget, über die Voreinstellungen |
| Schalttafeln im Hover | Addon-widget |
| Dieselbe gespeicherte Vorlage wird in mehreren Tab-Blöcken wiederverwendet | Addon-Widget auf Pro |
| Bearbeiten einer Seite, die vor Elementor 3.8 erstellt wurde | Das alte Widget, oder umbauen |
Fünf Dinge, die es wert sind, richtig zu werden
- Behalten Sie die Titel auf ein oder zwei Wörter. Lange Titel umschließen sich und ein umwickelter Streifen liest sich nicht mehr als Streifen.
- Vier Tabs sind auf dem Desktop ein komfortables Maximum, und drei sind besser, wenn die Titel Symbole tragen.
- Entscheiden Sie, was sich zuerst öffnet Das Kern-Widget öffnet immer Tab eins, also legen Sie das Panel dort ein, das die meisten Leute wollen.
- Alles, was ein Besucher lesen muss, gehört auf die Seite und nicht hinter einen Klick in Tab vier.
- Überprüfen Sie die Telefonansicht, bevor Sie veröffentlichen, da sich die beiden Routen dort unterschiedlich verhalten.
Häufig gestellte Fragen
Hat Elementor in der kostenlosen Version ein Tabs-Widget?
Ja. Das Tabs-Widget befindet sich im kostenlosen Plugin und die aktuelle Version ist die verschachtelte Version, die in jedem Panel einen Container platziert.
Was ist aus dem alten Tabs-Widget geworden?
Es ist veraltet. Seit Elementor 3.8 zeigt das Panel einen Hinweis an, wenn Sie einen bearbeiten, und jedes neue Tabs-Widget, das Sie hineinziehen, ist die verschachtelte Version.
Kann ich ein Formular oder eine Galerie in eine Registerkarte einfügen?
Mit Nested Tabs ja, weil jedes Panel ein Container ist Mit einem Addon-Widget nimmt das Panel Editorinhalte, das Äquivalent ist also eine gespeicherte Vorlage auf Pro.
Kann ein Tab-Titel ein Bild anstelle von Text verwenden?
Nicht im Kern-Widget Addon-Widgets mit Icon-Type-Steuerelement können ein Symbol oder ein Bild auf dem Titel verwenden.
Wie viele Tabs sind zu viele?
Nach vier oder fünf wickelt sich der Streifen auf Laptops und wird auf Telefonen unlesbar. An diesem Punkt ist ein Akkordeon normalerweise das bessere Layout.
Letzte Gedanken
Was im Inneren des Panels sitzt, entscheidet das Widgets in einem Panel bedeutet verschachtelte Tabs, jedes Mal Ein Streifen, der wie etwas Bestimmtes aussehen muss, mit Bildtiteln oder Hover-Switching, bedeutet ein Addon Beides ist ein zehnminütiger Build, sobald man weiß, in welchem man sich befindet.
Verwandte Lektüre
