Dynamische Tabelle
Preistabellen, Feature-Charts, Teamverzeichnisse & – Daten sind das Rückgrat guter Entscheidungen Aber eine Standard-HTML-Tabelle schreit nach “Spreadsheet,” nicht nach “Lösung” Master Addons Dynamic Table Element verwandelt strukturierte Informationen in ein gestaltetes Erlebnis Erstellen Sie jede Tabelle von Grund auf direkt im Elementor-Editor Definieren Sie Ihre Header, füllen Sie den Körper mit Text, Bildern, Symbolen oder sogar dynamischen Inhalten aus Ihren Beiträgen. Wenden Sie dann professionelles Styling auf jeder Ebene an: der Header, jede Zeile, einzelne Zellen. Schaffen Sie Klarheit, heben Sie hervor, worauf es ankommt, und machen Sie Ihre Daten zu etwas, das die Leute tatsächlich lesen möchten.
Visueller Drag & Drop Table Builder
Vergessen Sie komplexe Shortcodes Bauen Sie die gesamte Struktur Ihrer Tabelle in einer intuitiven visuellen Oberfläche auf Beginnen Sie mit der Definition Ihrer Tabellenkopfspalten (wie “Feature,” “Preis,” “Plan”).Dann fügen Sie Zeilen im Tabellenkörper hinzu und verwalten sie genau wie eine Tabellenkalkulation. Brauchen Sie eine weitere Zeile? Klicken Sie auf Element hinzufügen. Möchten Sie Zellen zusammenführen? Verwenden Sie für komplexe Layouts die Steuerelemente „Spaltenspanne und Zeilenspanne“Sie sehen, wie sich Ihre Tabelle beim Erstellen in Echtzeit bildet, wodurch der Prozess schnell, genau und vollständig visuell wird.
- Intuitive Header-Einrichtung: Fügen Sie Header-Spalten direkt im Editor hinzu und beschriften Sie sie, um die Struktur Ihrer Tabelle zu definieren.
- Live-Zeilenverwaltung: Hinzufügen, Löschen und Neuordnen von Körperreihen im Handumdrehen mit der Schaltfläche Element hinzufügen.
- Zellfusionsleistung: Erstellen Sie Header-Gruppen oder markieren Sie Schlüsselzellen mithilfe der Spaltenspannweiten- und Zeilenspannweitenoptionen.
Separate Steuerung für Kopfzeile und Karosseriedesign
Eine tolle Tabelle führt das Auge Machen Sie Ihre Kopfzeile als klare Anleitung für die Daten unten hervortreten Stil Sie die Tabellen-Kopfzeile völlig unabhängig Geben Sie ihr eine kräftige Hintergrundfarbe, eine ausgeprägte Textfarbe und eine starke Typografie Passen Sie die Innenzellenpolsterung an, um sie geräumig und leicht lesbar zu machen Dies schafft eine sofortige visuelle Hierarchie und hilft Benutzern, Ihre Daten in Sekundenschnelle zu scannen und zu verstehen. Die Körperreihen erhalten ihre eigenen, separaten Satz von Styling-Steuerelementen für perfekten Kontrast.
- Unabhängiges Header-Styling: Wenden Sie einzigartige Hintergrundfarben, Textfarben und Typografien nur auf die Header-Zeile an.
- Zellpolsterungssteuerung: Stellen Sie eine benutzerdefinierte Innenzellenpolsterung für Kopfzellen ein, um die Lesbarkeit und das Design zu verbessern.
- Körperspezifisches Styling: Gestalten Sie die Zeilen des Tischkörpers mit ihrem eigenen Hintergrund, ihrer eigenen Textfarbe und Ausrichtung.
Zellinhalt: Text, Symbole, Bild und dynamische Daten
Jede Zelle kann eine reichhaltigere Geschichte erzählen Über einfachen Text hinaus, fügen Sie Bilder ein oder wählen Sie Symbole aus der Bibliothek, um visuelle Feature-Häkchen ( ) oder Statusindikatoren zu erstellen Am aussagekräftigsten verbinden Sie Ihre Tabelle mit Live-Site-Inhalten mithilfe von Dynamic Tags. Ziehen Sie automatisch Daten wie Post-Titel, benutzerdefinierte Felder, ACF-Werte oder Benutzerinformationen ein Erstellen Sie eine Produktvergleichstabelle, ein Mitarbeiterverzeichnis oder einen Veranstaltungsplan, der automatisch aktualisiert wird – wirklich dynamisch.
- Multi-Format-Inhalt: Wählen Sie Text, Bild oder Symbol für jede Körperzelle.
- Symbolanpassung: Stilsymbole mit eigener Größe, Farbe und Polsterung innerhalb der Zelle.
- Dynamic Tags Integration: Befüllen Sie Zellen automatisch mit dynamischen Datenquellen (z.B. Post-Meta, Autorenname, benutzerdefinierte Felder).
- Flexible Ausrichtung: Kontrollieren Sie die horizontale und vertikale Ausrichtung des Inhalts in jeder Zelle für ein ausgefeiltes Layout.
Globales Tischstyling und professionelle Effekte
Binden Sie die ganze Tabelle mit globalen Designeinstellungen zusammen Aktivieren Sie gestreifte Tischreihen für einen klassischen, leicht zu scannenden Look und wählen Sie die alternierende Zeilenfarbe Steuern Sie den gesamten Border Type, die Breite und die Farbe für das gesamte Tischraster Stellen Sie eine universelle Innenzellenpolsterung für gleichmäßige Abstände ein Fügen Sie dem gesamten Tischbehälter einen Hintergrundtyp (Farbe, Farbverlauf) hinzu Diese globalen Berührungen stellen sicher, dass Ihr Tisch wie ein zusammenhängendes, speziell angefertigtes Element aussieht, nicht wie eine Ansammlung einzelner Zellen.
- Zebrastreifen: Schalten Sie den gestreiften Tisch ein und wählen Sie eine Farbe für abwechselnde Reihen aus, um die Lesbarkeit erheblich zu verbessern.
- Border Styling: Definieren Sie den Border-Typ, die Dicke und die Farbe für die Gitterlinien der gesamten Tabelle.
- Containerdesign: Fügen Sie einen Hintergrund hinzu und steuern Sie die Polsterung und den Rand des Gesamttisches.
- Gleichmäßiger Abstand: Tragen Sie eine globale Innenzellenpolsterung auf, um einen gleichmäßigen und komfortablen Abstand in allen Zellen zu gewährleisten.
Häufig gestellte Fragen für Dynamic Table
Kann ich diese Tabelle mit meinen benutzerdefinierten Beitragstypen oder erweiterten benutzerdefinierten Feldern (ACF) verbinden?
Ja, Sie können! durch die Funktion Dynamische Tags, die im Inhaltswähler der Körperzelle verfügbar ist Klicken Sie beim Bearbeiten einer Zelle auf das Datenbanksymbol, um das dynamische Tags-Panel zu öffnen Sie können dann aus Quellen wie “Titel posten,” “Benutzerdefinierte Felder,” “ACF-Feld,” und mehr auswählen, um die Tabelle mit Live-Daten aus Ihren Beiträgen, Produkten oder jedem benutzerdefinierten Posttyp zu füllen.
Ist der Tisch auf Mobilgeräten responsive?
Absolut. Die Tabelle ist responsiv gestaltet Auf sehr kleinen Bildschirmen möchten Sie vielleicht einen horizontalen Scrollcontainer in Elementor aktivieren oder die Anzahl der Spalten vereinfachen, das Styling (Padding, Schriftgrößen) passt sich an, und Sie können Einstellungen speziell für die mobile Ansicht über den Responsive-Editing-Modus von Elementor anpassen.
Kann ich mit diesem Element eine Preistabelle mit einer "hervorgehobenen" Spalte erstellen?
Definitiv. Du würdest für jede Preisstufe eine Spalte erstellen Um eine Spalte hervorzuheben (wie den “Popular” - Plan), kannst du die Funktion „Spalte Spanne” in einer Kopfzelle für ein Abzeichen verwenden und dann eine andere Hintergrundfarbe auf alle Zellen in dieser spezifischen Spalte anwenden, indem du eine benutzerdefinierte CSS-Klasse hinzufügst oder individuelle Optionen für das Zell-Styling verwendest, sofern in erweiterten Einstellungen verfügbar.
Was passiert, wenn ich einen sehr langen Text in einer Zelle hinzufüge?
Sie steuern das Verhalten Sie können eine benutzerdefinierte Breite für die Spalte festlegen, um die Erweiterung zu steuern Der Text wird innerhalb der Zelle gewickelt, basierend auf Ihren Typografie - und Padding-Einstellungen Bei langen Inhalten stellen Sie sicher, dass Sie über eine ausreichende Zeilenhöhe (gesteuert durch vertikale Polsterung) verfügen, um die Lesbarkeit zu erhalten.
Wie ist das im Vergleich zu der bloßen Verwendung eines HTML-Widgets oder eines Tabellen-Plugins?
Dieses Element gibt Ihnen visuelle Designkontrolle innerhalb von Elementor Im Gegensatz zu einem grundlegenden HTML-Widget müssen Sie keinen Code schreiben, um Ränder, Farben oder Ausrichtung zu gestalten Im Vergleich zu vielen Table-Plugins lässt es sich nahtlos in den Workflow und das Styling-System von Elementor integrieren und bietet so ein einheitlicheres und effizienteres Designerlebnis, ohne Ihre Website mit einem anderen eigenständigen Plugin aufzublähen.
Kann ich die Tabellendaten dynamisch sortieren oder filtern?
Dieses Element ist in erster Linie für statische oder dynamisch gefüllte Anzeigetabellen Es enthält keine integrierten Frontend-Sortier-, Filter- oder Suchfunktionen, wie es ein Datentabellen-Plugin tun würde. Für diese erweiterten interaktiven Funktionen benötigen Sie eine spezielle Lösung. Dieses Element eignet sich perfekt, um feste Informationen wie Preise, Spezifikationen oder Zeitpläne in einem wunderschön gestalteten Format darzustellen.
Trendige Elementor-Widgets und -Erweiterungen
Erstellen Sie anspruchsvolle Websites in kürzerer Zeit.
Glasmorphie
Container-extras
Muster
Post-/Seitenduplikator
