Tabellen sind ein wichtiger Bestandteil der meisten Webseiten. Du kannst sie nutzen, um alle Arten von Informationen zu teilen, von Preisen bis hin zu Listen von Funktionen und Links. Mit WordPress kannst du grundlegende Tabellen für deine Webseite einrichten, aber vielleicht suchst du nach mehr Anpassungsmöglichkeiten.
Mit Elementor hast du Zugriff auf mehrere Tabellen-Widgets. Außerdem gibt es viele Elementor-Tabellen-Plugins, die dem beliebten Page Builder neue Widgets hinzufügen.
In diesem Artikel erklären wir dir, wie WordPress-Tabellen funktionieren und wie sie mit Elementor-Widgets zu vergleichen sind. Dann zeigen wir dir, wie du Elementor-Tabellen manuell erstellst, und stellen dir einige Plugins vor, die den Editor um neue Tabellen-Widgets erweitern. Los geht’s!
Wann du WordPress-Tabellen verwenden solltest
Sobald du anfängst, nach ihnen zu suchen, wirst du feststellen, dass Tabellen überall im Internet zu finden sind. Das liegt daran, dass sie zu den vielseitigsten Elementen gehören, die du auf einer Webseite verwenden kannst.
Nimm zum Beispiel Preistabellen. Es gibt kaum eine Webseite für Dienstleistungen oder Abonnements, die keine Tabellen verwendet, um dir den Vergleich von Angeboten zu erleichtern:
Mit Tabellen kannst du große Mengen an Informationen so darstellen, dass sie für die Leser/innen leicht verdaulich sind. Noch besser: Tabellen machen es den Nutzern einfacher, mehrere Datensätze miteinander zu vergleichen:
Tabellen helfen dir nicht nur dabei, Informationen zu teilen, sondern können auch die Monotonie langer Absätze in einem Blogpost oder auf einer Seite durchbrechen. Normalerweise empfehlen wir dir, lange Textpassagen zu vermeiden, da sie schwer zu navigieren sind.
Mit dem Block-Editor kannst du ganz einfach Tabellen zu deiner Webseite hinzufügen. Mit dem Tabellenblock kannst du die Anzahl der Zeilen und Spalten festlegen, die du benötigst:
Obwohl das Hinzufügen von Tabellen in WordPress einfach ist, sind deine Anpassungsmöglichkeiten etwas eingeschränkt. Du kannst zwar die Hintergrundfarbe ändern, den Stil der Schaltflächen anpassen und die Schriftgröße verändern, aber das war’s auch schon. Wenn du elegantere und komplexere Tabellen erstellen willst, musst du einen Page Builder wie Elementor (oder sogar Divi) verwenden.
Was eine Elementor-Tabelle leisten kann
Wenn du über die grundlegenden WordPress-Tabellen hinausgehen willst, bietet dir Elementor Zugang zu einem hochgradig anpassbaren Preistabellen-Widget. Damit kannst du Tabellentitel bearbeiten, Überschriften setzen, Listen von Merkmalen hinzufügen, Calls To Action (CTAs) anpassen und vieles mehr:
Vergiss nicht, dass du mit Elementor jede Art von Layout für jede Seite oder jeden Beitrag erstellen kannst, die du möchtest. Das bedeutet, dass du mehrspaltige Designs einrichten kannst, so dass du mehrere Preistabellen-Widgets nebeneinander haben kannst:
Elementor verfügt auch über ein Inhaltsverzeichnis-Widget. Das macht die Navigation durch lange Inhalte für deine Leser viel einfacher.
So erstellst du eine Elementor-Tabelle (manuell)
Die Erstellung einer Preistabelle mit Elementor ist ganz einfach. Öffne den Elementor-Editor, um loszulegen. Hier kannst du entweder mit einer leeren Seite beginnen oder eine Vorlage aus der Elementor-Bibliothek importieren:
Wenn du bereit bist, das Element hinzuzufügen, musst du die Anzahl der Spalten auswählen, die die Tabelle haben soll. Klicke auf das Elementor-Pluszeichen am unteren Rand des Editors und wähle die Spaltenstruktur aus, die du für den Preisbereich verwenden möchtest:
Wenn du mehrere Spalten verwendest, musst du für jede Spalte ein eigenes Preistabellen-Widget einfügen. Obwohl jede Tabelle ein eigenes Element ist, sehen die Nutzer sie nebeneinander (oder untereinander auf dem Handy) als Teil eines Abschnitts:
Wir empfehlen, zuerst ein Preistabellenmodul hinzuzufügen und es zu gestalten. Dann kannst du dieses Element in die verbleibenden Spalten duplizieren oder kopieren und jeder Spalte einen eigenen Text hinzufügen.
Um die Tabelle anzupassen, wählst du das Element aus und gehst zum Reiter Stil unter den Widget-Einstellungen. Elementor bietet dir eine Vielzahl von Styling-Optionen. Dazu gehören Farbauswahl, Typografieeinstellungen und einzigartige Konfigurationen für jeden Abschnitt der Tabelle:
Wenn du mit dem Stil der Preistabelle zufrieden bist, klicke mit der rechten Maustaste auf das Element und wähle die Option Duplizieren. Eine Kopie der Tabelle wird unter dem ursprünglichen Element angezeigt und du kannst sie in eine der leeren Spalten ziehen:
Diesen Vorgang wiederholst du für so viele Spalten, wie du haben möchtest. Denke daran, dass jede Tabelle einen eigenen Stil haben kann, wenn du die Einstellungen nicht wiederverwenden willst. Achte in diesem Fall darauf, dass die Stile ähnlich genug sind, damit die Besucher wissen, dass sie einen Vergleich sehen.
Wenn du deine Tabelle anpasst, denke daran, dass du mit Elementor jedem Modul eigene CSS hinzufügen kannst. Gehe dazu in die erweiterten Einstellungen des Widgets und wähle den Reiter Custom CSS:
Das Hinzufügen von benutzerdefiniertem CSS über Elementor ist viel einfacher als das manuelle Bearbeiten von WordPress-Code. Wenn du CSS in WordPress be arbeitest, musst du auf die Themadateien zugreifen und den Code für eine optimale Leistung optimieren. Mit Elementor musst du nur den CSS-Code in das entsprechende Feld für jedes Modul einfügen.
Wenn das manuelle Hinzufügen von CSS einschüchternd klingt, mach dir keine Sorgen. Um CSS zu lernen, musst du kein Webentwickler sein. Aber es ist eine wertvolle Fähigkeit, die dir helfen wird, deine WordPress-Webseiten anzupassen (und vielleicht sogar eine Karriere in der Webentwicklung zu finden).
Wenn alle Tabellen fertig sind, kannst du ihren Text bearbeiten und so viele Funktionen hinzufügen, wie du für jeden Eintrag brauchst. Dazu wählst du eine Tabelle aus und wechselst zum Reiter Inhalt unter den Widget-Einstellungen:
Die Bearbeitung des Inhalts deiner Preistabellen ist ganz einfach. Du kannst auf ein beliebiges Element innerhalb des Widgets klicken, um es zu bearbeiten. Wenn du mit dem Ergebnis zufrieden bist, sind deine Preistabellen einsatzbereit.
Die besten Elementor-Tabellen-Plugins (12 Optionen)
Obwohl Elementor viele Tools enthält, die dir bei der Erstellung von Tabellen helfen, kannst du immer noch weitere Widgets hinzufügen. In diesem Abschnitt stellen wir dir 12 Elementor-Plugins vor, mit denen du neue Arten von Tabellen zu deinen Beiträgen und Seiten hinzufügen kannst. Auch wenn viele dieser Addons für Elementor entwickelt wurden, kannst du sie auch als normale Plugins installieren.
Wie immer empfehlen wir nur erstklassige WordPress-Plugins, die eine gute Leistung bieten und regelmäßig aktualisiert werden. Wenn du gut optimierte Plugins verwendest, kannst du deine Webseite skalieren, ohne dass es zu Leistungsproblemen kommt.
1. ElementsKit Add-Ons für Elementor
ElementsKit fügt über 85 Widgets zu Elementor hinzu. Du hast Optionen für einfache Tabellen, Preistabellen, Unterstützung für die Einbettung von TablePress-Elementen und mehr.
Die Professional-Version von ElementsKit enthält außerdem ein erweitertes Tabellen-Widget. Damit kannst du den Tabellen Such- und Filterfunktionen hinzufügen. Außerdem kannst du eine Paginierung einbauen, damit die Nutzer/innen durch die Einträge navigieren können, ohne dass du riesige Tabellen auf deiner Webseite hast.
Hauptmerkmale:
- Drei Arten von Tabellen-Widgets
- Unterstützung für das Filtern, Suchen und Paginieren von Tabellen
- Integration mit TablePress zum Einbetten von Tabellen
Preis: ElementsKit-Lizenzen gibt es ab $39 pro Jahr.
2. WP Table Builder
Wenn du ein Fan von Drag-and-Drop-Editoren bist (was du sein solltest, wenn du Elementor verwendest), wirst du WP Table Builder lieben. Mit diesem Plugin kannst du Tabellen mit vorkonfigurierten Elementen wie Schaltflächen, Bewertungsabschnitten, Produktbewertungen und mehr erstellen.
Zusätzlich zu den fortgeschrittenen Elementen hast du Zugriff auf grundlegende Module wie Text und Bilder. Das Plugin wird außerdem mit Tabellenvorlagen geliefert, die deine Arbeit noch einfacher machen.
Du kannst WP Table Builder-Tabellen mit dem Block-Editor zu deiner Webseite hinzufügen. Das Plugin lässt sich auch mit Elementor integrieren, sodass du Tabellen ganz einfach überall auf deiner Webseite platzieren kannst.
Hauptmerkmale:
- Verwendung eines Drag-and-Drop-Tabellen-Builders
- Zugriff auf vorgefertigte Elemente wie Schaltflächen, Bewertungsabschnitte und Produktbewertungen
- Passe den Stil der einzelnen Elemente in deinen Tabellen an
- Vorgefertigte Seitenvorlagen verwenden
Preis: WP Table Builder-Lizenzen beginnen bei $39 pro Jahr.
3. TablePress
TablePress ist ein kostenloses Plugin, das einer Tabellenkalkulation in WordPress sehr nahe kommt. Das Plugin kann Daten in verschiedenen Formaten importieren, darunter Excel-, CSV- und JSON-Dateien. Du kannst sogar Tabellendaten für andere Programme exportieren.
Mit TablePress kannst du Tabellen erstellen, die eine Suchfunktion enthalten. Die Nutzer/innen können wählen, wie viele Einträge angezeigt werden sollen und sich von Seite zu Seite bewegen, wenn du große Datensätze anzeigst.
Das Einbinden von TablePress-Tabellen in Elementor ist einfach. Das Plugin erstellt einzigartige Shortcodes für jede Tabelle. Mit dem Elementor Shortcode Widget kannst du diese Codes überall auf deiner Webseite einfügen.
Hauptmerkmale:
- Importiere und exportiere Datensätze in den Formaten Excel, CSV, JSON und HTML
- Füge durchsuchbare Tabellen zu WordPress hinzu
- Aktiviere die Paginierung für Tabellen
Preis: TablePress ist ein kostenloses Plugin, aber du kannst Premium-Erweiterungen dafür finden.
4. Essential Addons für Elementor
Essential Addons for Elementor fügt dem Page Builder über 80 neue Widgets hinzu. Du hast Optionen für Preistabellen, Datentabellen, Inhaltsverzeichnisse und mehr.
Essential Addons for Elementor gibt es in zwei Versionen. Das kostenlose Plugin fügt eine bessere Version des Preistabellen-Widgets hinzu, mit dem Elementor geliefert wird. Wenn du Zugriff auf Datentabellen haben möchtest (mit Filterung, Suche und mehreren Stilen), musst du eine Premium-Lizenz erwerben.
Hauptmerkmale:
- Hinzufügen von Widgets für Preis-, Daten- und Inhaltstabellen
- Suche und Filterung in Tabellen ermöglichen
Preis: Es gibt eine kostenlose Version von Essential Addons für Elementor und Premium-Lizenzen ab 39,97 $ pro Jahr.
5. PowerPack für Elementor
PowerPack für Elementor fügt dem Page Builder über 70 Widgets hinzu. Das Plugin enthält außerdem eine große Anzahl neuer Vorlagen, mit denen du Webseiten schneller gestalten kannst.
Was Tabellen angeht, kannst du mit dem PowerPack sortierbare und durchsuchbare Datentabellen einrichten. Du kannst Daten mit Hilfe von CSV-Dateien in Tabellen importieren. Das Plugin enthält außerdem mehrere Optionen für Tabellenvorlagen.
Neben den Datentabellen bietet PowerPack auch Widgets für Info- und Preistabellen. Infotabellen sind ideal, wenn du deinen Besuchern eine Übersicht über die von dir angebotenen Dienstleistungen geben möchtest.
Hauptmerkmale:
- Sortierbare und durchsuchbare Datentabellen erstellen
- Datentabellen im CSV-Format importieren
- Hinzufügen von Widgets für Preis- und Infotabellen
Preis: PowerPack-Lizenzen gibt es ab $44 pro Jahr.
6. Exclusive Addons für Elementor
Exclusive Addons für Elementor gibt es in einer kostenlosen und einer Premium-Version. Das kostenlose Plugin fügt Elementor 39 neue Widgets hinzu, während du mit einer Premium-Lizenz über 69 neue Elemente erhältst.
Bei den Tabellen fügt die kostenlose Version ein neues Preistabellenmodul dem Mix hinzu. Mit der Premium-Version erhältst du Zugang zu Vergleichs- und Datentabellen. Die Vergleichstabellen funktionieren ähnlich wie die Preiselemente, aber du kannst neue Layouts und Stile verwenden.
Hauptmerkmale:
- Hinzufügen eines neuen Moduls für Preistabellen
- Zugriff auf Vergleichs- und Datentabellen
- Zugriff auf mehrere Layouts für Tabellen-Widgets
Preis: Es gibt eine kostenlose Version von Exclusive Addons für Elementor. Premium-Lizenzen gibt es ab $29 pro Jahr.
7. JetElements
JetElements fügt 45 neue Widgets zu Elementor hinzu. Die meisten von ihnen sind für E-Commerce- und Abonnement-Webseiten gedacht. JetElements hat aber auch einige interessante Tabellen-Widgets im Programm.
Zu diesen Widgets gehören Preistabellen und responsive Tabellen. Im Vergleich zu den grundlegenden Preistabellen in Elementor bietet dir die JetElements-Version viele neue Anpassungsmöglichkeiten. So kannst du zum Beispiel mit vielen visuellen Effekten wie Parallaxen und Mikroanimationen für Tabellenelemente spielen.
Hauptmerkmale:
- Hinzufügen von Preistabellen und responsiven Tabellen zu Elementor
- Anpassen von Tabellen mit neuen visuellen Effekten, wie z. B. Parallax
Preis: JetElements All-Inclusive-Lizenzen gibt es ab 130 $ pro Jahr. Du kannst auch benutzerdefinierte Widget-Bundles erstellen und nur die Optionen auswählen, die du verwenden möchtest.
8. Premium Addons für Elementor
Premium Addons für Elementor gibt es sowohl in der kostenlosen als auch in der Premium-Version. Allerdings fügt nur das Premium-Plugin neue Tabellen-Widgets zu Elementor hinzu.
Wenn du für eine Premium-Lizenz bezahlst, erhältst du Zugang zu neuen Daten- und Preistabellen-Widgets. Du kannst Datentabellen mit Diagramm- und Grafik-Widgets ergänzen, wenn du deinen Besuchern mehr Informationen zeigen möchtest.
Hauptmerkmale:
- Hinzufügen von Daten- und Preistabellen-Widgets zu Elementor
- Begleite Tabellen mit Diagramm- und Grafik-Widgets
Preis: Lizenzen für Premium Addons für Elementor gibt es ab $39 pro Jahr.
9. DataMentor
DataMentor ist ein Plugin, das Elementor ein einzelnes Tabellen-Widget hinzufügt. Dieses Widget bietet jedoch viel mehr Funktionen als die meisten Add-ons, die wir bisher gesehen haben.
DataMentor-Tabellen sind unglaublich vielseitig. Du kannst Bilder, Schaltflächen, Listen und Icons in jedes Element einfügen. Das Widget ermöglicht es dir, Tabellen mit individuellen Stilen für jede Spalte oder Zeile zu erstellen. Du hast außerdem Zugriff auf verschiedene Tabellenvorlagen, wenn du mit der Gestaltung beginnen möchtest.
Hauptmerkmale:
- Hinzufügen eines neuen Tabellen-Widgets zu Elementor
- Zugriff auf mehrere Tabellenvorlagen
- Hinzufügen von Bildern, Text, Schaltflächen, Listen und Icons in Tabellen
Preis: DataMentor ist ein kostenloses Plugin.
10. Happy Addons für Elementor
Happy Addons für Elementor ist eines der umfangreichsten Plugins für den Page Builder. Dieses Tool fügt Elementor über 99 Widgets und eine breite Sammlung neuer Vorlagen hinzu.
Für Tabellen bietet Happy Addons sowohl einfache als auch erweiterte Tabellen-Widgets. Die erweiterte Version unterstützt den Import von Daten in verschiedenen Formaten sowie die Suche, Filterung und Paginierung. Außerdem hast du Zugriff auf mehrere vorgefertigte Tabellenlayouts. Zusätzlich zu diesen Optionen bietet Happy Addons auch Elemente für Preis- und Vergleichstabellen.
Hauptmerkmale:
- Zugriff auf grundlegende und erweiterte Tabellen-Widgets
- Importieren von Daten für erweiterte Ablesungen
- Vorgefertigte Tabellenlayouts verwenden
- Hinzufügen von Preis- und Vergleichstabellen
Preis: Es gibt eine kostenlose Version von Happy Addons. Premium-Lizenzen gibt es ab 39 $ pro Jahr.
11. Royal Elementor Addons
Royal Elementor Addons fügt über 40 neue Widgets zu Elementor hinzu. Diese sind alle kostenlos, aber das Plugin gibt es auch in einer Premium-Version, die zusätzliche Anpassungsoptionen für jedes Widget freischaltet.
Mit den Royal Elementor Addons erhältst du eine neue Preistabelle, die du in Elementor verwenden kannst. Dieses Widget enthält mehrere neue Styling-Optionen. Außerdem verfügt es über eine Umschaltoption, mit der Besucher zwischen monatlichen und jährlichen Preisen (oder anderen Optionen) wechseln können.
Hauptmerkmale:
- Hinzufügen eines neuen Preistabellen-Widgets zu Elementor
- Anpassen von Preistabellen mit neuen Styling-Optionen
- Hinzufügen eines Preis-Toggles zu deinen Tabellen
Preis: Royal Elementor Addons ist kostenlos. Premium-Lizenzen kosten $29 pro Website (es handelt sich um eine einmalige Gebühr).
12. Elementor Addon Elements
Elementor Addon Elements ist ein kostenloses Plugin, das über 24 neue Widgets zu Elementor hinzufügt. Darunter findest du Optionen für Preis-, Vergleichs- und Datentabellen.
Preistabellen bieten viele zusätzliche Anpassungsmöglichkeiten, die das Standard-Widget von Elementor nicht hat. Bei Datentabellen kannst du wählen, ob du durchsuchbare oder filterbare Elemente erstellen möchtest. Außerdem unterstützen die Tabellen Animationen, was sie optisch viel ansprechender macht.
Hauptmerkmale:
- Hinzufügen von Preis-, Vergleichs- und Datentabellen zu Elementor
- Wähle zwischen filterbaren und durchsuchbaren Datentabellen
- Hinzufügen von Animationen zu Datentabellen
Preis: Elementor Addon Elements ist kostenlos.
Zusammenfassung
Elementor bietet dir eine breite Palette von Werkzeugen, um stilvolle und komplexe WordPress-Tabellen zu erstellen. Viele WordPress-Tabellen-Plugins sind auch mit Elementor kompatibel, d.h. mit dem Page Builder kannst du fast jede Art von Tabelle in deine Webseite einbauen.
Der Elementor-Seitenersteller wird mit einem intuitiven Preistabellen-Widget geliefert. Wenn du andere Arten von Tabellen hinzufügen möchtest, empfehlen wir die Verwendung von Elementor-Tabellen-Plugins wie ElementsKit oder WP Table Builder.
Kinsta CDN ist ein leistungsstarkes CDN, das allen Kinsta-Kunden ohne zusätzliche Kosten zur Verfügung steht. Es wird von unserer kostenlosen Cloudflare-Integration betrieben und liefert deine Inhalte automatisch von über 200 PoPs auf der ganzen Welt aus. Wenn du Fragen zum Kinsta CDN hast, kannst du dich gerne an unser 24/7-Support-Team wenden!
Schreibe einen Kommentar