Kostenloses Elementor-Inhaltstabellen-Widget
Elementors eigenes Table of Contents Widget kommt mit Elementor Pro. Das Table of Contents Widget in Master Addons ist kostenlos, Lasst es auf einen Beitrag oder eine Seite fallen und es liest dort die Überschriften, dann baut es eine verlinkte Liste daraus in Überschriftenreihenfolge auf Ein Klick auf ein beliebiges Element scrollt den Leser zu diesem Abschnitt, Ihr wählt aus, welche Überschriften-Tags aufgenommen werden sollen und ob die Liste Aufzählungen oder Zahlen zeigt Ihr könnt die Leser das Kästchen wegklappen lassen und einen Pfeil nach oben hinzufügen lassen, und Titel, Trennzeichen und Links haben jeweils ihre eigenen Stilsteuerelemente.
So fügen Sie ein Inhaltsverzeichnis in Elementor hinzu
Sie benötigen Elementor und das kostenlose Plugin Master Addons, sonst nichts Die Seite braucht auch echte Überschriften-Tags (H2, H3 und so weiter), denn daraus ist die Liste aufgebaut.
- Installieren und aktivieren Master Addons von WordPress.org, und überprüfen Sie, ob das Inhaltsverzeichnis im Master Addons-Dashboard aktiviert ist.
- Öffnen Sie Ihren Beitrag oder Ihre Seite mit Elementor und durchsuchen Sie das Widgets-Panel nach Inhaltsverzeichnis.
- Ziehen Sie es dorthin, wo die Liste sitzen soll, normalerweise über den ersten Abschnitt oder in eine Seitenleistenspalte.
- In InhaltLegen Sie den Titel fest, wählen Sie einen Listenstil aus und wählen Sie die einzuschließenden Überschriftstags aus.
- Offen Zusammenklappbar und Scrollen Um den Knebel, den Pfeil von hinten nach oben und einen Scroll-Offset für Ihren Header hinzuzufügen.
- Stylen Sie Titel, Trennzeichen und Links im Register Stil, sehen Sie sich dann die Seite in der Vorschau an und klicken Sie auf einige Elemente, um die Sprünge zu testen.
Jede Einstellung wird in der Inhaltsverzeichnis Widget-Einstellungen Führung.
Erstellt die Liste aus Ihren Überschriften
Wählen Sie die Ebenen in Überschriften-tags. H2, H3 und H4 sind standardmäßig ausgewählt, und es kann jedes von H1 bis H6 hinzugefügt werden, wenn die Seite geladen wird, findet das Widget diese Überschriften, gibt jedem eine ID, wenn es keine hat, und nistet die Liste nach Überschriftenebene, benenne oder füge eine Überschrift hinzu und die Liste nimmt sie bei der nächsten Ladung auf, sodass es keine Ankerlinks gibt, um von Hand mitzuhalten.
- Listenstil: Standard (kein Marker), Kugeln oder Zahlen.
- Überspringen Sie eine Überschrift: CSS-Klasse hinzufügen
jltma-toc-hide-headingAuf der Registerkarte Erweitert dieser Überschrift. - Separator anzeigen: Eine optionale Linie unter dem Titel mit eigenem Stil, Farbe, Dicke und Abstand.
- Überschriften-IDs werden aus dem Überschriftstext erstellt, sodass Sie auch direkt auf einen Abschnitt von anderswo verlinken können.
Zusammenklappbare Box für Seitenleisten und Mobilgeräte
Einschalten Machen Sie Inhalte zusammenklappbar Und neben dem Titel erscheint ein Kippsymbol Leser klicken darauf, um die Liste zu öffnen oder zu schließen, und sie rutscht, anstatt zu springen Einschalten Bleiben Sie zunächst zusammengebrochen Wenn Sie möchten, dass das Feld geladen wird und nur der Titel angezeigt wird, was auf langen Seiten mit Rechtsform und in schmalen Seitenleistenspalten hilfreich ist.
- Symbolgröße und Symbolfarbsteuerelemente für den Kippschalter.
- Der Trenner lässt sich mit der Liste wegklappen.
- Das Widget hat keine eigene klebrige Einstellung. Damit die Box sichtbar bleibt, während die Leute lesen, kleben Sie die Spalte an Ihr Thema oder an Elementor Pro Motion Effects.
Glatte Sprünge und ein Pfeil von hinten nach oben
Durch Klicken auf ein Element wird die Seite bis zu ihrer Überschrift durchgescrollt. Scroll-Animationsverzögerung (ms) Legt fest, wie lange dieser Scroll dauert, standardmäßig 500 und bis 2000. Mit Glatte Schriftrolle Auf bekommen Sie auch Glatter Scroll-Offset (px), die kurz vor der Überschrift anhält, sodass ein fester Header sie nicht abdeckt Sie können einen anderen Offset für Desktop, Tablet und Mobilgerät festlegen.
- Nach oben scrollen Fügt einen kleinen Pfeil in der unteren rechten Ecke hinzu, der anzeigt, sobald ein Besucher nach unten scrollt.
- Der Pfeil bringt die Leser zurück zum Inhaltsverzeichnis oder zu der Position, die Sie in Scroll to Top Offset eingestellt haben.
- Größen-, Symbolfarben- und Hintergrundfarbsteuerelemente für den Pfeil.
- Das Element, auf das ein Leser geklickt hat, behält die aktive Farbe aus dem Abschnitt Inhaltstil, damit er sehen kann, wohin er gesprungen ist.
Inhaltsverzeichnis von Elementor Pro vs. Inhaltsverzeichnis von Master Addons
Das Table of Contents-Widget von Elementor benötigt eine Elementor Pro-Lizenz und gibt Ihnen mehr Kontrolle darüber, welche Überschriften angezeigt werden und wie sich die Liste beim Scrollen verhält. Master Addons erledigt den alltäglichen Job kostenlos und fügt einen Pfeil nach hinten zum oberen Pfeil hinzu.
| Merkmal | Elementor Pro | Master Addons |
|---|---|---|
| Preis | Benötigt Elementor Pro | Kostenlos mit Master Addons |
| Welche Überschriften | Anchors By Tags (H1 bis H6) plus eine Containerauswahl zur Begrenzung des Suchbereichs | Überschriften-Tags (H1 bis H6) aus dem Hauptbeitrag oder Seiteninhalt |
| Überschriften auslassend | Anker nach Selektor, jeder CSS-Selektor | CSS-Klasse jltma-toc-ausblenden-Überschrift auf jeder Überschrift |
| Markierungen | Zahlen oder Kugeln mit einem von Ihnen gewählten Symbol | Standard, Kugeln oder Zahlen |
| Nistend | Hierarchische Ansicht Unterpunkte umschalten und einklappen | Immer nach Überschriftenebene verschachtelt |
| Kollaps | Minimieren Sie Box mit Erweiterungs- und Einklappungssymbolen und einem Haltepunkt, an dem es minimiert beginnt | Machen Sie Inhalte kollabierbar und bleiben Sie zunächst kollabiert |
| Aktives Element | Folgt dem angezeigten Abschnitt, während der Leser scrollt | Markiert den Artikel, auf den der Leser geklickt hat |
| Einstellungen scrollen | Keine Geschwindigkeits - oder Offset-Steuerelemente im Widget | Scroll-Animationsverzögerung und ein Smooth-Scroll-Offset pro Gerät |
| Zurück zum oberen Pfeil | Keine | Scrollen Sie mit Größen- und Farbsteuerelementen nach oben |
Wenn Sie bereits für Elementor Pro bezahlen und möchten, dass die Liste den Leser beim Scrollen verfolgt, verwenden Sie dessen Widget Wenn Sie ein kostenloses Inhaltsverzeichnis mit zusammenklappbarem Kästchen und einem Pfeil von hinten nach oben wünschen, verwenden Sie dieses Verwandte: Fortschrittsanzeige lesen, Erweiterte Akkordeon und Off-Canvas-Inhalt (Pro).
Häufig gestellte Fragen zum Inhaltsverzeichnis
Ist das Inhaltsverzeichnis-Widget kostenlos?
Ja. Es ist Teil des kostenlosen Master Addons Plugins auf WordPress.org, und jede Einstellung, die auf dieser Seite beschrieben wird, ist in der kostenlosen Version Elementors eigenes Table of Contents Widget benötigt Elementor Pro.
Wie schließe ich eine Überschrift aus dem Inhaltsverzeichnis aus?
Um eine ganze Ebene fallen zu lassen, entfernen Sie dieses Tag aus Überschriften Tags, zum Beispiel H4. Um eine Überschrift auszublenden, wählen Sie sie in Elementor aus, öffnen Sie die Registerkarte Erweitert und fügen Sie hinzu jltma-toc-hide-heading Zum Feld CSS-Klassen Es bleibt auf der Seite, wird aber aus der Liste herausgelassen.
Ändert sich das aktive Element, wenn der Leser scrollt?
Nein. Die aktive Farbe im Stil, Inhalt styles den Gegenstand, auf den ein Leser klickt, und er bewegt sich, wenn er auf einen anderen Gegenstand klickt Die Liste verfolgt den Abschnitt auf dem Bildschirm beim Scrollen nicht Das Inhaltsverzeichnis-Widget von Elementor Pro macht das.
Wird der Pfeil von Scroll nach Top auf jeder Seite angezeigt?
Nur auf Seiten, die dieses Widget mit Scroll to Top eingeschaltet enthalten Der Pfeil sitzt in der rechten unteren Ecke und zeigt an, nachdem der Besucher die Seite ca. 250 px runter gescrollt hat.
Kann ich benutzerdefinierte Symbole für die Listenmarkierungen verwenden?
Nicht aus dem Widget-Panel List Style bietet Standard, Bullets und Zahlen, und der Abschnitt Content Style legt die Schriftart und Farben fest Benutzerdefinierte Markierungssymbole würden ein eigenes CSS benötigen Das Widget von Elementor Pro verfügt über einen Symbolwähler für Kugeln.
Trendige Elementor-Widgets und -Erweiterungen
Erstellen Sie anspruchsvolle Websites in kürzerer Zeit.
Glasmorphie
Container-extras
Muster
![Master Addons Post/Page Duplicator-Erweiterung für Elementor: MA Duplicator Zeilenlink in der WordPress Pages-Liste, der eine Landing Page erstellt - [Duplicated #128] Entwurf](https://d1asvmc6qcowgk.cloudfront.net/wp-content/uploads/2026/09/15102930/post-page-duplicator-768x403.webp)
Post-/Seitenduplikator
