So erstellen Sie erweiterte HTML-Tabellen in WordPress ohne Codierung

WordPress bleibt die weltweit beliebteste CMS-Plattform mit einem Anteil von 43 % am gesamten Web. Obwohl es zweifellos eines der attraktivsten Features ist, ist WordPress nicht unbedingt die beste Plattform, wenn es darum geht, HTML-Tabellen ohne Codierung zu erstellen.

Obwohl viele Leute denken, dass HTML-Tabellen veraltet sind, bieten sie dem Publikum immer noch einen hervorragenden Wert. Infolgedessen mussten die meisten Benutzer Experten für die jeweilige „nur Entwickler“-Aufgabe einstellen. In Anbetracht des Verwendungszwecks war es damals eine große Enttäuschung für WordPress-Benutzer.

Gutenberg: Der Standard-Editor von WordPress mit einem Tabellenblock

Während des Europe WordCamp im Juli 2017 gab WordPress-Gründer Matt Mullenweg bekannt, dass der Gutenberg-Blockeditor der zukünftige Editor für WordPress sei. Zur Freude vieler WordPress-Benutzer versprach der brandneue Editor, einen eingebauten Tabellenblock enthalten zu haben.

Als Gutenberg jedoch mit WordPress 5.0 auf den Markt kam, wurde der Editor dafür kritisiert, dass er auf verschiedenen Geräten Reaktions- und Optimierungsprobleme verursachte. Nichtsdestotrotz wurde der Editor wie versprochen mit einem eingebauten Tabellenblock geliefert, der es Benutzern ermöglicht, Tabellen auf ihrer Website zu erstellen, ohne programmieren zu müssen.

Obwohl der Gutenberg-Tabellenblock eine ziemlich praktische Option zum Erstellen von HTML-Tabellen in WordPress ist, war er meilenweit hinter einer effektiven Tabellenerstellungslösung zurückgeblieben. Es wird nicht das attraktivste Aussehen bieten, ist nicht wiederverwendbar und ist nicht gut im Umgang mit riesigen Datenbanken.

Gutenberg ist nichts anderes als ein einfacher Tabellenbauer. Sie können Gutenberg nicht für erweiterte HTML-Tabellenfunktionen wie Tabellensortierung, Filterung oder Gestaltung verwenden. Alles in allem ist der Gutenberg-Blockeditor weit davon entfernt, ein fortgeschrittener Tabellenersteller zu werden.

Daher lag es an Free-Roaming-WordPress-Entwicklern wie uns, WPManageNinja, ein Plugin zu erstellen, das Ihrem Dashboard erweiterte Tabellenfunktionen hinzufügt.

Ninja Tables: Erweitertes HTML-Tabellen-WordPress-Plugin

Noch bevor Gutenberg angekündigt wurde, arbeiteten unsere Entwickler bei WPManageNinja unermüdlich daran, ein zuverlässiges WordPress-Tabellen-Plugin zu entwickeln, mit dem Benutzer problemlos Tabellen erstellen können.

Am 27. Februar 2018 haben wir Ninja Tables im WordPress-Plugin-Store veröffentlicht, und es dauerte nur wenige Monate, bis Ninja Tabes über 30.000 aktive Installationen erreichte! Die unglaubliche Unterstützung und Wertschätzung unserer Benutzer hat uns auch motiviert, mehr als 45 Plugin-Updates in weniger als 2,5 Jahren seit der ersten Veröffentlichung zu veröffentlichen, was Ninja Tables in diesem Prozess zur Nummer eins unter den WordPress-Tabellen-Plugins macht!

Dank seiner dynamischen Funktionen und seiner benutzerfreundlichen Oberfläche wird Ninja Tables jetzt von über 70.000 Websites und Unternehmen verwendet.

Ninja Tables ist ein Datenvisualisierungs-Plugin, mit dem Sie eine Vielzahl von Tabellen zur Präsentation auf Ihrer Website erstellen können. Die Reaktionsfähigkeit, die Funktionen, die Anpassungsmöglichkeiten und die Integrationen von Drittanbietern machen es zu Ihrer besten Wahl, wenn es darum geht, diese schwer zu entfernenden erweiterten HTML-Tabellen in Ihre WordPress-Site zu integrieren.

Lassen Sie uns nun in die fortschrittlichsten Funktionen zum Erstellen und Anpassen von HTML-Tabellen von Ninja Tables eintauchen.

• Die Benutzeroberfläche
• Tabelleneditor
• Integrationen

Die Benutzeroberfläche

Nach der Aktivierung können Ninja Tables in der Seitenleiste Ihres WordPress-Dashboards gefunden werden. Wie die meisten WordPress-Plugins bietet Ninja Table eine Benutzeroberfläche mit mehreren Funktionen. Lassen Sie uns mehr darüber erfahren!

• Alle Registerkarten
• Werkzeuge und Einstellungen
• Hilfe und Dokumentationen

Home/Alle Tische

Ninja Tables Home hat eine ansprechende Oberfläche mit frischen Angeboten. Es bietet Ihnen zwei Schaltflächen, eine zum Erstellen und eine zum Importieren.

Die Schaltfläche Create Your First Table führt Sie zu einem manuellen WordPress-Tabellenersteller, während Sie auch aus CSV importieren können.

Wenn Sie sich entscheiden, eine Tabelle von Grund auf neu zu erstellen, werden Sie in einem Popup-Fenster aufgefordert, einen Titel und eine Beschreibung anzugeben. Möglicherweise bemerken Sie auch mehrere andere Registerkarten, die verschiedene Import- und Integrationsfunktionen bieten. Mit der kostenlosen Version von Ninja Tables können Sie jedoch nur über CSV oder JSON importieren und in WP Fluent Forms integrieren.

Nachdem Sie einen Titel und eine Beschreibung angegeben haben, klicken Sie auf die Schaltfläche Hinzufügen , um auf den Tabellenersteller zuzugreifen. Wenn Sie keine benötigen, können Sie das Beschreibungsfeld überspringen.

Die Importfunktion funktioniert auch auf die gleiche Weise. Sie können eine Excel-Datei oder eine andere CSV-Datei auswählen, die Sie auf Ihrem Computer erstellt haben, um sie auf Ihre Website hochzuladen.

In jedem Fall landen Sie im Tabelleneditor. Beachten Sie, dass Ihre erstellten Tabellen wiederverwendbar sind und im Startfenster angezeigt werden. Ninja Tables identifizieren Tabellen anhand von Shortcodes. Um eine Tabelle in einem Beitrag oder einer Seite Ihrer Website zu verwenden, müssen Sie nur den Tabellen-Shortcode auf Ihrer Seite oder Ihrem Beitrag kopieren und einfügen.

Werkzeuge und Einstellungen

Neben der Registerkarte " Startseite " enthält Ninja Table auch eine Registerkarte "Tools und Einstellungen ", mit der Benutzer das globale Erscheinungsbild importieren, ändern, Benutzerberechtigungen festlegen und globale Einstellungen ändern können.

Das Import -Tool eignet sich, wenn Sie bereits ein anderes gängiges Tabellen-Plugin verwendet haben und auf Ninja Table umgestiegen sind. Ninja Table verfügt über eine Ein-Klick-Tabellenimportfunktion für TablePress, Ultimate Tables und Data Tables Generator von Supsystic. Auf dieser Registerkarte können Sie auch CSV-Dateien importieren.

Als nächstes können Sie auf der Registerkarte „ Global Appearance “ Tabellenstile ändern. Ninja-Tabellen können Ihre Tabellen mithilfe von drei verschiedenen Tabellen-UI-Stilen improvisieren. Sie können auch jeden Stil nach Ihren Wünschen anpassen und auswählen, ob Sie Besuchern erlauben möchten, Ihre Tabellen zu durchsuchen und zu filtern. Die Darstellungsregeln können jedoch auch für jede Tabelle separat geändert werden.

Leider können Sie die Berechtigung nicht für verschiedene Backend-Benutzer festlegen, es sei denn, Sie haben die Pro-Version von Ninja Tables. Auf der verbleibenden Registerkarte können Sie auswählen, wie mit Javascript-Fehlern umgegangen wird, und den Tabellen-Cache löschen .

Hilfe und Dokumentation

Die große Auswahl an Funktionen von Ninja Tables erfordert eine zuverlässige Dokumentation, und unser Team hat alles vorbereitet, was Sie über Ninja Tables wissen müssen.

Unsere Hilfe- und Dokumentationsschnittstelle bietet ein gut dokumentiertes Benutzerhandbuch für ein tiefes Verständnis der Möglichkeiten von Ninja Tables. Und wenn Sie immer noch Probleme haben, können Sie uns jederzeit kontaktieren, indem Sie ein Support-Ticket einreichen!

Nachdem Sie nun die Benutzeroberfläche kennengelernt haben, möchten Sie sicherlich eine Tabelle erstellen! Also geh zurück zum Home und fange an, eins zu erstellen!

Der Tabelleneditor

Der Tabelleneditor ist eines der aufregendsten Dinge an Ninja Tables. Es bietet einige der fortschrittlichsten Funktionen zum Erstellen von HTML-Tabellen sowie Anpassungsmöglichkeiten. Wenn Sie auf die Schaltfläche " Hinzufügen " oder "Importieren" klicken, gelangen Sie zum abgerundeten Tabelleneditor von Ninja Tables.

Die Benutzeroberfläche des Tabellenerstellers von Ninja Tables besteht aus den oben angezeigten Abschnitten. Jeder Abschnitt des Tabellenerstellers verfügt über mehrere Anpassungsfunktionen zum Erstellen und Entwerfen schöner WordPress-HTML-Tabellen.

Sie können den Tabellentitel und die Beschreibung ändern und eine Tabellenüberschrift festlegen , indem Sie oben auf die Schaltfläche Bearbeiten klicken. Darüber hinaus können Sie mit der Benutzeroberfläche des Tabellenerstellers von Ninja Tables jederzeit eine Vorschau Ihrer Tabelle anzeigen.

• Tabellenzeilen
• Aufbau
• Design
• Frontend-Bearbeitung
• Benutzerdefinierte CSS
• Import Export

Lassen Sie uns die Tabellenerstellungsfunktionen einzeln besprechen.

Tabellenzeilen

Tabellenzeilen sind einer der grundlegenden Aspekte jedes HTML-Tabellenerstellers in WordPress. Wie es heißt, können Sie beginnen, indem Sie auf die Schaltfläche Spalte hinzufügen klicken!

Die Schaltfläche öffnet ein Spaltenerstellungsfenster, das einige der fortschrittlichsten HTML-Tabellenfunktionen in WordPress gewährt. Ninja Tables ist nicht nur ein einfacher Tabellenersteller mit durchschnittlichen Funktionen zum Erstellen von Spalten; es ist viel mehr als das.

Während Sie also einen Spaltentitel schreiben können, können Sie auch Datentyp und Responsive Breakpoints festlegen (Responsive Breakpoint lässt Sie auswählen, ob eine Spalte auf bestimmten Geräten angezeigt werden soll) .

Die kostenlose Version schränkt jedoch das Hochladen von Auswahlfeldern, Bildern und Dateien ein und erlaubt Ihnen nicht, Schaltflächen zu erstellen. Dennoch bietet das Plugin einige unglaubliche Funktionen zum Hinzufügen von Daten wie HTML Field , Numeric Value und Date Field .

Und wenn Sie immer noch nach mehr Kontrolle über Ihre Tabellenspalten suchen, können Sie Erweiterte Einstellungen , Bedingte Einstellungen und Transformationswert entsperren, die auf den anderen Registerkarten zur Spaltenanpassung verfügbar sind. Weitere Informationen zu ihrer Funktionsweise finden Sie in der Ninja Tables-Dokumentation.

Nachdem Sie Tabellenspalten hinzugefügt haben, wird im Editor eine Schaltfläche Daten hinzufügen angezeigt. Damit können Sie mühelos Daten zu Ihrer Website hinzufügen. Sie können die Spalten separat anpassen, indem Sie auf das Zahnradsymbol neben der Spaltenüberschrift klicken und Daten jederzeit bearbeiten, duplizieren oder löschen!

Schließlich können Sie im Abschnitt Tabellenzeilen auch Massenaktionen durchführen oder eine kompakte Ansicht festlegen, wenn Ihre Tabelle aus vielen Daten besteht.

Tabellenkonfiguration

Die Registerkarte Tabellenkonfiguration bietet eine Drag-and-Drop-Spaltenorganisation. Im Allgemeinen können HTML-Tabellen nicht auf WordPress organisiert werden, sobald sie erstellt wurden.

In dieser Hinsicht schränken Ninja Tables die Tischorganisation nicht ein. Die Tabellenzeilen können per Drag-and-Drop organisiert werden, während Sie auch neue Spalten erstellen oder die vorhandenen bearbeiten können.

Auf der nächsten Registerkarte der Tabellenkonfigurationsregisterkarte können Sie Rendering-Einstellungen auswählen, dh wie Ihre Tabellen von Browsern gerendert werden sollen. Standardmäßig werden Ihre Tabellen mit Ajax Table -Einstellungen gerendert. Mit dieser Funktion können Sie riesige Datenbanken integrieren, ohne die Geschwindigkeit Ihrer Website zu beeinträchtigen.

Obwohl es zwei Rendering-Optionen gibt, können Sie keine erweiterten Tabelleneinstellungen auswählen, es sei denn, Sie haben die Pro-Version. Die erweiterte Tabelle kann einige der fortschrittlichsten Tabellenfelder enthalten, einschließlich Zellrand und Shortcodes, und eignet sich für die SEO-Optimierung.

Benutzerdefinierte Filter sind eine praktische Funktion, wenn Sie ein Optionsfeld, ein Kontrollkästchen, eine Datumsauswahl oder verschiedene andere spezialisierte Benutzeroberflächen in Ihre Tabelle aufnehmen möchten. Diese könnten hervorragende Conversion-Optimierungsfunktionen bieten, wenn Sie Produkte anzeigen oder weitere Daten in Ihre Tabellenzellen einfügen. Der benutzerdefinierte Filter ist jedoch auch ein Profi-Feature.

Die Schaltflächenkonfiguration ermöglicht es Ihnen, die Schaltfläche „Drucken“ oder „CSV-Import“ einzuschließen (Pro-Funktion). Die Spracheinstellungen sind nützlich, wenn Sie daran interessiert sind, eine andere Sprache für Ihre Tabellensuchleiste, Ihren Suchplatzhalter oder Ihre Such-Dropdown-Überschrift zu verwenden.

Tabellendesign

Das Ninja Tables Table Design ist ein unglaublicher visueller Customizer. Es verfügt über drei Styling-Bibliotheken mit bis zu neun Stilanpassungsfunktionen, die Ihnen maximale visuelle Kontrolle über Ihre HTML-Tabellen in WordPress geben.

Neben dem Stil können Sie auch auswählen, ob Sie den Tabellentitel, die Beschreibung, die Suchleiste, den Spaltenfilter, die Kopfzeile, den Rahmen usw. anzeigen möchten. Darüber hinaus können Sie Zielgeräte festlegen, indem Sie die Stapelbare Tabellenkonfiguration aktivieren, damit sie nicht beschädigt werden auf jedem Gerät.

Stil spielt eine bedeutende Rolle bei der visuellen Attraktivität eines Tisches. Am wichtigsten ist jedoch die Farbe. Ninja-Tabellen bieten eine vollständige Farbanpassung auf der Registerkarte Tabellenfarbe. Sie können alles anpassen, von der Farbe der Tabellenüberschrift bis hin zu den Tabellenrändern, und es gibt keine Beschränkung der zulässigen Farben.

Und wenn Sie sich nicht für eine Farbanpassung entscheiden können, enthält Ninja Table dreizehn vordefinierte Farbschemata für Ihre Tische! Diese unglaubliche Funktion erfordert jedoch eine Premium-Version.

Die verbleibende Registerkarte für das Tabellendesign bietet verschiedene Anpassungsfunktionen wie Paginierung, Position der Suchleiste, Sortiermethode, und Sie können Ihrem Tabellendesign eine zusätzliche CSS-Klasse zuweisen.

Frontend-Bearbeitung

Frontend Editing ist ein weiterer beispielhafter Grund, warum Ninja Tables mehr als ein Tabellen-Plugin ist. Damit können Sie die Bearbeitung für Ihren Front-End-Benutzer aktivieren. Wenn Ihre Benutzer beispielsweise die Tabellendaten ausfüllen müssen, können Sie die Frontend-Bearbeitung erleichtern. Die Frontend-Bearbeitungsfunktion ist jedoch nur in der Premium-Version verfügbar.

Benutzerdefiniertes CSS/JS

Mit benutzerdefiniertem CSS können Sie das Erscheinungsbild von HTML in WordPress steuern, und im Fall des Plugins gibt es Ihnen die Kontrolle über Ihre Tabellen. Obwohl der Artikel für Nicht-Programmierer gedacht ist, können CSS- und Javascript-Kenntnisse Ihnen umfassende Kontrolle über das Erscheinungsbild von Ninja-Tabellen bieten.

Import Export

Auch hier können Sie mit der Importfunktion eine CSV-Datei importieren oder eine vorhandene Tabelle über CSV ersetzen. Andererseits ermöglicht Ihnen die Exportfunktion, Ihre Tabelle in einer CSV-Datei zu speichern.

Integrationen

Ninja Tables enthält alle wesentlichen Tools und Funktionen zum problemlosen Erstellen von HTML-Tabellen in WordPress. Aber die Befugnisse beschränken sich nicht auf das Erstellen von Tischen. Es ist weit mehr als nur ein Tabellen-Plugin und kommt mit mehreren unglaublichen Integrationen. Alle bieten hervorragende Einrichtungen!

• Fluent Forms-Integration
• WP-Beiträge
• WooCommerce
• Google Tabellen
• Ninja-Charts

Fluent Forms-Integration

Als Website-Eigentümer verwenden Sie wahrscheinlich ein Formular-Plugin auf Ihrer Website. Was wäre, wenn Sie die Formulareinträge in eine Tabelle übernehmen wollten? Ninja Tables verwendet Ihre Formulareinträge, um eine Tabelle zu erstellen und anzuzeigen, ohne dass Sie etwas tun müssen, außer die Tabelle einzurichten.

WP Fluent Forms ist derzeit das weltweit beste Kontaktformular-Plugin, und wenn Sie das Plugin zum Sammeln von Daten von Ihrem Publikum verwendet haben, können Sie es ohne großen Aufwand in Ihre WordPress-Tabellen aufnehmen.

WP-Posts-Integration

Ninja Tables bringt Ihre Kontaktformulareinträge nicht nur in Tabellen. Es kann auch alle Ihre Posts, Produkte, Seiten und vieles mehr mit wenigen Klicks in einer Tabelle organisieren. Wenn Sie Ihre Posts oder Produkte kategorisieren möchten, kann die Integration von Ninja Tables WP Posts Ihre Arbeit erheblich minimieren.

WooCommerce-Integration

WooCommerce ist das beliebteste WordPress-Shop-Plugin. Eine große Anzahl von Menschen, die WooCommerce verwenden, bedeutet jedoch auch, dass viele von ihnen die gleiche Benutzererfahrung bieten. Ninja Tables mit WooCommerce-Integration ist ein legendäres Plugin, das Vielfalt auf Ihrer Website und Effektivität in Ihrem Backend bieten kann. Es erhöht die Konversionsraten und ermöglicht gleichzeitig die unkomplizierteste Verwaltung des WooCommerce-Shops! Ninja Tables ist genau das, was Sie brauchen, um Ihren WooCommerce-Shop zu verwalten.

Google Sheets-Integration

Es ist unglaublich, was Ninja Tables unter seinen Ärmeln versteckt hat! Das denkst du, oder?

Vielleicht gehört Google Sheets zu den besten Integrationsoptionen, die ein WordPress-Plugin bieten kann. Google Sheet ist die beliebteste Online-Tabelle mit den einfachsten Funktionen. Die Web-App verfügt über absolut erstklassige Funktionen und, was noch wichtiger ist, sie ist von jedem Gerät aus zugänglich!

Ninja Tables kann sich mit allen Google-Blättern verbinden und seine Daten auf Ihrer Website anzeigen, wenn das Blatt aktualisiert wird. Wenn Sie also Ihre Tabellen unterwegs aktualisieren müssen, ist die Google Sheets-Integration von Ninja Tables eine absolute Meisterklasse!

Ninja Charts-Integration

Tabellen arbeiten mit Daten. Wir sind auf WordPress-Tabellen angewiesen, weil sie uns statistische Daten zeigen. Manchmal müssen wir jedoch etwas kreativ werden und grafische Möglichkeiten finden, sie darzustellen. Die Ninja Charts-Integration ist die perfekte Lösung für die Erstellung einer visuellen Präsentation von Tabellendaten. Möchten Sie sehen, was Sie damit machen können? Schauen Sie sich das Video an!

Einpacken

Mit Ninja Tables haben die Schwierigkeiten beim Erstellen von fortgeschrittenen HTML-Tabellen auf WordPress endlich ein Ende! Es ist die One-Stop-Lösung für alle WordPress-Benutzer, die schöne Datentabellen anzeigen müssen, während sie auf HTML-Codes verzichten müssen.

Stellen Sie also Tische her, erhöhen Sie das Engagement, verbessern Sie die Konversion und tun Sie mehr als nur Tabellenerstellung mit Ninja Tables.

Das ist alles für heute. Ich wünsche Ihnen alles Gute.

Co-Autor: Nusrat Fariha

Nusrat ist ein kreativer Content-Autor bei WPManageNinja, der es liebt, an verschiedenen Themen zu arbeiten. Und wenn sie nicht schreibt, liest sie wahrscheinlich ihre Lieblingsbücher!