Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Dieter Petereit 26. Januar 2018

wpDataTables macht Tabellen in WordPress zu einem Kinderspiel

Tabellen in WordPress-Beiträgen sind in vie­len moder­nen Themes bereits vor­ge­se­hen. Über die rei­ne Optik gehen die­se Lösungen jedoch nicht hin­aus. wpDataTables hin­ge­gen erlaubt euch das Erstellen und Verwalten von Tabellen und deren Daten, wie kein ande­res.

Unsere Tabellen-Tool-Wunschliste

Natürlich könnt ihr her­ge­hen und mit gutem alten HTML eine Tabelle in euren Beitrag klöp­peln. Das ist nicht wei­ter schwie­rig und mit CSS auch nach Belieben zu gestal­ten. Für ein­fa­che Bedarfe, etwa das struk­tu­rier­te Impressum oder eine Preistabelle mit einem Dutzend Einträgen reicht das voll­kom­men aus.

Wenn ihr aber Tabellen tat­säch­lich als Datencontainer braucht, weil ihr eine Tool-Übersicht oder eine kom­ple­xe Feature-Übersicht oder ein­fach sons­ti­ge, grö­ße­re Mengen an struk­tu­rier­ten Daten auf­be­rei­tet zei­gen wollt, benö­tigt ihr was ande­res. Schließlich soll sich die Ansicht auto­ma­tisch aktua­li­sie­ren, wenn neue Inhalte in der Datenbank oder Datentabelle, nen­nen wir es gene­risch Datenquelle, vor­lie­gen. Natürlich soll der Betrachter die Tabelle nach sei­nen eige­nen Erfordernissen sor­tie­ren kön­nen und farb­li­che Hervorhebungen, je nach defi­nier­ten Konditionen, wären wirk­lich pri­ma. Wenn jetzt noch Filterfunktionen für grö­ße­re Datentabellen zur Verfügung stün­den, was blie­be da zu wün­schen übrig?

Zellhervorhebung nach defi­nier­ten Bedingungen, das soge­nann­te Conditional Formatting (Screenshot: Dr. Web)

Gut, respon­siv soll­ten sie sich ver­hal­ten, die Tabellen. Und wenn wir sie sogar zur Daten-Eingabe sei­tens des Besuchers nut­zen könn­ten, hät­ten wir einen ordent­li­chen Zusatznutzen. Dazu müss­te das Tool Frontend-Editing beherr­schen, was ja ganz all­ge­mein ein fan­tas­ti­sches Feature wäre. Bisweilen wol­len wir unse­re Daten zusätz­lich als Charts zei­gen, weil sich ein­fach Marktanteile oder ande­re kom­pe­ti­ti­ve Daten ange­neh­mer gra­fisch, denn als rei­ne Zahlenliste visua­li­sie­ren las­sen. Außerdem wol­len wir natür­lich nicht hand-coden müs­sen, um zum Ziel zu gelan­gen. So, damit soll­te unse­re Wunschliste lang genug gewor­den sein.

wpDataTables erfüllt all unsere Wünsche

wpDataTables ist das Premium-WordPress-Plugin, das alle der genann­ten Wünsche erfüllt. Es stammt aus der Belgrader Software-Schmiede TMS, die sich mit immer­hin 12 Teammitgliedern um die spe­zi­fi­schen Bedürfnisse ihrer Kunden küm­mert. wpDataTables ist nicht die ein­zi­ge Beschäftigung der Damen und Herren von TMS. Vielmehr erstel­len sie eben­so Software-Lösungen für sen­si­ble Branchen, dar­un­ter die auf­stre­ben­de FinTech-Branche, eben­so wie für wis­sen­schaft­li­che Einrichtungen. Ihre Kundschaft ist inter­na­tio­nal. Dies sei nicht etwa vor­aus­ge­schickt, um TMS über den Klee zu loben, son­dern ist ledig­lich als Qualifikationsnachweis zu sehen. wpDataTables ist eine pro­fes­sio­nel­le Lösung eines pro­fes­sio­nel­len Teams.

Mit der wei­ter oben geschrie­be­nen Wunschliste haben wir denn auch tat­säch­lich die Feature-Liste des Plugins zur Hand. Dabei ist die Funktionalität aber weit­aus anspruchs­vol­ler, als unse­re klei­ne Wunschliste ver­deut­li­chen könn­te. Schon die Einbindung einer Tabelle ist ja kein abschlie­ßend defi­nier­tes Feature. Was ver­steht wpDataTables dar­un­ter?

Der Assistent von wpDataTables hilft euch bei der Erstellung einer neu­en Tabelle. (Screenshot: Dr. Web)

Zum einen kön­nen wir eine Tabelle ganz klas­sisch manu­ell erstel­len und ein­bin­den. Dabei erstel­len wir zunächst die Tabelle mit ihren Datenspalten und befül­len sie anschlie­ßend hän­disch mit den ent­spre­chen­den Dateninhalten. Dabei stellt uns wpDataTables meh­re­re Wege des Editierens der Daten zur Verfügung.

Der Standard Editor erlaubt uns das dia­log­ge­steu­er­te Befüllen der Tabelle. Hier erhal­ten wir ein Formular, in wel­ches wir die gewünsch­ten Inhalte ein­tra­gen. Diese klas­si­sche Form der Datenerfassung spricht Nutzer an, die nur weni­ge Datenfelder mit Inhalten fül­len müs­sen und Wert auf eine gewis­se Steuerung sei­tens des Verfahrens legen.

Der Excel-like Editor hin­ge­gen zeigt uns die Daten in der Form einer Tabelle und erlaubt es, Daten direkt in die ein­zel­nen Tabellenzellen zu schrei­ben. Diese Form der Datenerfassung eig­net sich für Nutzer, die schnell gro­ße Mengen an Daten manu­ell erfas­sen müs­sen, fix den Inhalt einer ein­zel­nen Zelle kor­ri­gie­ren wol­len oder per Copy-and-Paste Daten aus einer vor­han­de­nen Tabelle ein­pfle­gen wol­len.

Der Excel-like Editor gibt euch Zugriff auf die Daten wie in einem Excel-Sheet. (Screenshot: Dr. Web)

Wenn wir indes Daten ohne­hin als Tabelle und die­se wie­der­um als Excel, CSV, Google Tabelle, MySQL-Query, XML, JSON oder als PHP-Array vor­lie­gen haben, müs­sen wir die­sen Weg gar nicht gehen. In dem Falle machen wir es uns ein­fa­cher und wäh­len zwi­schen zwei Alternativen. Entweder lin­ken wir die Datenquelle ein, was dafür sorgt, dass die Datenquelle bei jedem Aufruf der Tabelle mit der exter­nen Quelle syn­chro­ni­siert wird. Oder – wenn wir Excel, CSV oder Google Tabellen als Quelle haben – wir impor­tie­ren die Quelle ein­ma­lig in unse­re MySQL-Datenbank. Danach sind die Daten voll edi­tier­bar, wäh­rend das bei der Sync-Lösung nur mit MySQL-Queries geht.

Die drit­te gro­ße Möglichkeit, eine Tabelle in wpDataTables anzu­le­gen, besteht dar­in, direkt ein MySQL-Query auf die WordPress-Datenbank oder sogar eine belie­bi­ge exter­ne Datenbank abzu­set­zen und die Rückmeldung zu tabel­li­sie­ren. Auch hier­zu ist es nicht etwa erfor­der­lich, dass ihr SQL sprecht. Die Abfragen wer­den mit einem gra­fi­schen Helferlein erstellt. Das kann im Grunde jeder. Änderungen an den ver­bun­de­nen Daten, wer­den in der Urspungsdatenbank gespei­chert, so dass ihr euer WordPress hier tat­säch­lich als Datenbankmanager ver­wen­den könnt. Dabei bleibt die Schwerarbeit dem jewei­li­gen SQL-Server über­las­sen. wpDataTables holt sich ledig­lich per Ajax die Ergebnisse oder schickt die Änderungen zurück.

Einmal ange­leg­te Tabellen oder Charts fügt ihr ganz sim­pel per Klick auf eines der Icons im Tiny MCE, dem Standard-Texteditor eures WordPress an gewünsch­ter Stelle ein. Natürlich könnt ihr die ent­spre­chen­den Shortcodes auch manu­ell inte­grie­ren.

Integration in den Tiny MCE. (Screenshot: Dr. Web)

Die Entwickler ver­spre­chen übri­gens, dass das Plugin auch bei Millionen Datenreihen nicht ins Schwitzen kommt und immer noch per­for­mant ablie­fert. Sämtliche Tabellen ver­hal­ten sich auf mobi­len Geräten voll respon­siv. Dabei ist es egal, wel­ches Theme ihr ver­wen­det, solan­ge es sich sel­ber respon­siv ver­hält, natür­lich.

wpDataTables an die Arbeit zu bekommen ist ebenso einfach

Da wpDataTables ein Plugin für WordPress ist, stellt euch die Installation nicht vor Probleme. Nach dem Erwerb des Plugins steht es euch als Zip-Archiv zur Verfügung. Dieses instal­liert ihr im Backend eurer WordPress-Installation unter Plugins > Installieren > Plugin hoch­la­den. Nach der fol­gen­den Aktivierung steht euch wpDataTables mit einem eige­nen Menüpunkt im links­sei­tig ange­ord­ne­ten Navigationsmenü des Backend zur Verfügung.

wpDataTables arbei­tet out-of-the-box und bedarf grund­sätz­lich kei­ner wei­te­ren Konfiguration im Vorfeld. Dennoch ist das Plugin hoch­an­pass­bar, wie die­ser Screenshot erah­nen lässt:

Das Menü geht davon aus, dass ihr ent­we­der auf vor­han­de­ne Tabellen zugrei­fen oder eine neue Tabelle erstel­len wollt. Oder, dass ihr auf ein vor­han­de­nes Visualisierungs-Chart zugrei­fen oder ein neu­es erstel­len wollt. Damit dürf­te euch die Bedienung nicht vor Schwierigkeiten stel­len. Von der Übersicht der Tabellen und der der Charts aus, ist es eben­so mög­lich, neue Elemente zu erstel­len. Alle Wege füh­ren also nach Rom.

Datenvisualisierung mit ver­schie­de­nen Renderern. (Screenshot: Dr. Web)

Die Auswahl ver­schie­de­ner Darstellungsoptionen lässt kei­nen Bedarf unge­deckt, ist aber abhän­gig von der Wahl des Renderers:

Verschiedene Darstellungsoptionen im Chart-Modul. (Screenshot: TMS)

Über ver­schie­de­ne Addons bedient der Hersteller spe­zi­el­le­re Bedarfe, die nicht in jedem Szenario vor­kom­men. Diese Addons sind jeweils kos­ten­pflich­tig. Wenn ihr wpDataTables für die Darstellung wirk­lich gro­ßer Datenmengen nutzt, wird euch womög­lich das Addon Powerful Filters inter­es­sie­ren.

Dieses erlaubt euch, kas­ka­die­ren­de Filter auf eure Datentabellen los­zu­las­sen, also sol­che, die auf­ein­an­der auf­bau­en, um die ange­zeig­te Datenmenge immer wei­ter ein­zu­schrän­ken. So könn­tet ihr etwa aus einem Tinder-Datenbestand erst ein­mal alle Frauen fil­tern, danach alle Blonden, danach alle min­des­tens 1,60 Meter gro­ßen – Ihr ver­steht das Prinzip. Powerful Filters kos­tet sepa­ra­te 33 US-Dollar – in Deutschland zuzüg­lich Mehrwertsteuer. Bislang gibt es vier sepa­ra­te Addons. TMS kün­digt aller­dings wei­te­re an.

Die vier Addons, mit denen du die Leistungsfähigkeit von wpDataTables noch­mal erwei­tern kannst. (Screenshot: Dr. Web)

wpDataTables erfreut sich einer aus­ge­zeich­ne­ten Dokumentation, die durch vie­le Video-Tutorials ergänzt wird. Wenn du des Englischen mäch­tig bist, wird dich die Einarbeitung in wpDataTables nicht in Schweiß aus­bre­chen las­sen. Hier gilt es, zudem zu beto­nen, dass wpDataTables sogar ohne die exten­si­ve Dokumentation sehr leicht zu erler­nen ist.

Bei einem Preis von 44 US-Dollar zuzüg­lich Mehrwertsteuer (in Deutschland), müsst ihr aktu­ell rund 43 Euro für das Plugin auf den Tisch des Hauses zäh­len. Meine Bestellung bei Pizza Joe’s ges­tern Abend war teu­rer. Der Preis ist aber nicht nur im Vergleich zu Pizza güns­tig, son­dern vor allem in Anbetracht des­sen, was dafür geleis­tet wird, als aus­ge­spro­chen preis­wert zu bezeich­nen.

Zusammenfassung für Eilige

wpDataTables ist ein Premium-Plugin für WordPress, das sich mit 44 US-Dollar auf dem Envato-Market eines für den Funktionsumfang nied­ri­gen Preises und einer, mit über 14.000 Verkäufen nicht nur gro­ßen, son­dern, belegt durch Durchschnittsbewertungen mit 4,65 von 5 Sternen, auch einer durch­aus begeis­ter­ten Nutzerschaft erfreut. Der Preis ist übri­gens ein Verkaufspreis, kein Abo oder sons­ti­ge Subskription. Ihr erhal­tet nach dem ein­ma­li­gen Kauf alle zukünf­ti­gen Versionen kos­ten­los.

wpDataTables sorgt für das rei­bungs­lo­se Rendering auch sehr gro­ßer Tabellen und Charts. Millionen von Datenzeilen stel­len das Plugin nicht vor Probleme. Sämtliche Funktionalität erfor­dert kei­ne Coding-Kenntnisse, alle Features kön­nen gra­fisch ver­wen­det wer­den. Dabei ist das Plugin kom­pa­ti­bel zu einer gan­zen Reihe mög­li­cher Input-Quellen, dar­un­ter Excel, CSV, JSON, Google Tabellen, MySQL und ande­re.

wpDataTables ist das Tool der Wahl für jeden, der eine WordPress-Site betreibt, auf der Daten tabel­la­risch oder als Grafik auf­be­rei­tet, gezeigt wer­den sol­len. Ebenso ist es mög­lich, die Nutzer mit den Daten inter­agie­ren zu las­sen. Mit optio­nal erhält­li­chen Addons lässt sich das Featureset des Plugins bedarfs­ge­recht erwei­tern.

Wenn ihr euch jetzt direkt selbst ein Bild von der Leistungsfähigkeit machen wollt, so habt ihr zwei Möglichkeiten. Zum einen steht eine Online-Sandbox als Demo mit allen Features für euch bereit. Zum ande­ren könnt ihr eine abge­speck­te Version des Plugins aus dem Plugin-Repository instal­lie­ren und auf eurer Seite ver­wen­den. In der Lite-Version nicht ver­füg­ba­re Features sind den­noch sicht­bar vor­han­den, aber eben als nur in der Vollversion ver­füg­bar gekenn­zeich­net.

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.