Alle modernen Websites sind so konzipiert, dass sie auf einer Vielzahl von Bildschirmbreiten korrekt funktionieren. Tabellen wurden früher mit einfachem HTML erstellt. Da flexibles Webdesign zum neuen Standard geworden ist, haben grundlegende HTML-Tabellen Schwierigkeiten, mit den Anforderungen moderner Websites Schritt zu halten. Da die einfachen HTML-Tabellen nicht responsive sind, ist der darin enthaltene Text auf mobilen Bildschirmgrößen extrem schwer lesbar, weshalb sie zur Entwicklung responsiver Tabellen verwendet werden, die ihr Layout je nach Bildschirmgröße anpassen, auf der sie angezeigt werden. HTML- und CSS-Medienabfragen müssen in Verbindung miteinander verwendet werden.
- Lösung 1: Tabellen können mit dem Divi Builder erstellt werden.
- Lösung 2: Verwenden Sie Tabellen- plugin , die diese Funktionalität standardmäßig enthalten!
- WP Table Manager
- Schnittstelle für den WP Table Manager
- Fazit
Tabellen können mit einem lesbaren Layout auf allen Bildschirmgrößen für einen einzigen Satz von Informationen erstellt werden, der nicht zu groß oder vielfältig ist, und dies kann mit grundlegenden HTML- und CSS-Ansätzen erreicht werden. Wenn die Tabelle jedoch eine beträchtliche Datenmenge enthalten soll, ist es nicht einfach, auf mobilen Geräten oder Bildschirmen mit einer Breite von weniger als 786 Pixeln ein lesbares Layout zu erstellen.
Wenn der Webdesigner, der mit HTML und CSS arbeitet, um eine Tabelle auf allen Bildschirmgrößen ansprechend zu gestalten, die Datenmenge nicht berücksichtigt, werden sie wahrscheinlich auf Probleme stoßen, die die Lesbarkeit des Inhalts der Website erheblich beeinträchtigen. Hier sind einige Vorschläge, die Sie als Divi-Website-Designer in die Praxis umsetzen können, wenn Sie versuchen, responsive Tabellen manuell zu erstellen.
Während Sie die Größe der Tabelle reduzieren, um einen kleineren Bildschirm unterzubringen, müssen Sie mehrere CSS-Klassen erstellen, wobei jede Klasse auf eine bestimmte Bildschirmauflösung abzielt.
Eine alternative Lösung besteht darin, bestimmte Spalten aus der Tabelle auszublenden, wenn die Bildschirmgröße geringer ist.
Bei kleineren Bildschirmen können Sie horizontale oder vertikale Bildläufe in die Kopf- und Fußzeilen der Tabelle einfügen.
Erstellen Sie eine einzelne Tabelle, die auf alle Bildschirmgrößen skaliert werden kann, und zoomen Sie die Tabelle, um das Material besser lesbar zu machen.
Diese Lösungen erfordern einen erheblichen Aufwand und die Anforderungen können je nach Inhalt und Bildschirmgröße unterschiedlich sein.
Lösung 1: Tabellen können mit dem Divi Builder erstellt werden.
Elegant Themes hat ein Tutorial erstellt, um zu zeigen, wie responsive Tabellen mit den integrierten Funktionen von Divi erstellt werden. Schau es dir hier an. Sie haben den Spalten, die den Tabellencontainer überlaufen, horizontale Bildlauffunktionen hinzugefügt, sodass die Tabelle besser auf Benutzereingaben reagiert. Weitere Informationen finden Sie auf der Tutorial-Seite:
Lösung 2: Verwenden Sie Tabellen- plugin , die diese Funktionalität standardmäßig enthalten!
Das Erstellen einer responsiven Tabelle für Ihre Divi-Website ist dank der Fülle an KOSTENLOSEN plugin Lösungen im Repo kein Problem mehr. Es ist jedoch etwas schwierig, Tabellen- plugin zu finden, die über integrierte mobile Reaktionsoptionen verfügen. Beliebte plugin wie wpDataTables haben diese Funktion nicht als kostenlose Option.
In diesem Artikel betrachten wir das WP Tabe Builder- plugin als eines der besten.
WP Table Manager
WP Table Manager ist das einzige WordPress-Tabellen- plugin , das eine komplette Tabellenkalkulationsoberfläche zum Verwalten von Tabellen bietet. Erstellen Sie eine Tabelle, wählen Sie ein Design aus und beginnen Sie mit der Bearbeitung von Tabellen, sobald Sie die Erstellung abgeschlossen haben. Sie profitieren von einem umfassenden Satz leistungsstarker Tabellenbearbeitungsfunktionen, einschließlich HTML-Zellenbearbeitung, Tabellenkopie, Berechnung und Synchronisierung mit Excel, Google Sheets und Office 365; Es ist so einfach wie das Klicken auf eine Zelle und das Bearbeiten von Daten mit oder ohne Hilfe eines visuellen Texteditors für den Endbenutzer, um eine Tabelle zu ändern.
WP Table Manager können Sie mit einer einfachen visuellen Benutzeroberfläche attraktive, ansprechende Tabellen erstellen. Die Nutzung ist kostenlos. Sobald Sie es aktiviert haben, werden Sie zur Einrichtungsanleitung weitergeleitet. Befolgen Sie die Verfahren und nehmen Sie die erforderlichen Anpassungen nach Ihren Wünschen vor. Wie von Zauberhand haben Sie einen schönen Tisch geschaffen, der auf jedem Gerät jeder Größe schön zur Geltung kommt. Dann musst du nur noch den Shortcode kopieren und auf der Seite einfügen, wo er erscheinen soll. Der Builder bietet derzeit sieben Elemente (Text, Bild, Liste, Schaltfläche, Sternbewertung, benutzerdefiniertes HTML und Shortcode), die Sie mithilfe der Drag-and-Drop-Funktion in Tabellenplatzhalter ziehen und ablegen können. Diese können verwendet werden, um verschiedene Arten von Tabellen zu erstellen, wie z. B. Produktvergleichstabellen, Preistabellen, Listentabellen usw.; Dies ist das Tabellen- plugin , das wir während unserer Untersuchung als das anfängerfreundlichste herausgefunden haben. Bitte beachten Sie, dass die vorliegende Version weder über ein Suchfeld noch über sonstige Filterfunktionen verfügt. Darüber hinaus ist dies möglicherweise nicht die ideale Option, wenn Sie viele Datensätze eingeben oder verwalten möchten. Für diese Art von Anwendungsszenario sind Visualizer oder Tablepress beide eine ausgezeichnete Wahl.
Schnittstelle für den WP Table Manager
Sie können den Shortcode entweder in ein Codemodul oder ein Textmodul in Divi einfügen.
Das DIVI-Theme enthält den WP Table Manager .
WP Table Manager plugin beantwortet die Verwaltung von Details beim Umgang mit Tabellen.
- Sobald die Filteroption für Ihre Tabelle aktiviert ist, können Sie jede Spalte nach Daten durchsuchen und die gesamte Tabelle filtern. Es funktioniert auch bei großen Tabellen, einschließlich Paginierung
- Der Aufwärts- und Abwärtspfeil in jeder Spalte ordnet Ihre Tabellendaten an. Die Sortierung von Tabellendaten funktioniert auch bei großen Tabellen, einschließlich Paginierung.
- Nachdem Sie Ihre Tabelle mit allen benötigten Daten erstellt haben, können Sie den Benutzern die Sortierung überlassen, aber auch eine Standardreihenfolge festlegen. Das kann sehr nützlich sein, wenn sich die Informationen im Laufe der Zeit ändern, da Sie die Läufer nach dem Rennen in der Reihenfolge ihres Eintreffens sortieren können.
- Die Paginierung ist erforderlich, wenn Sie eine große Tabelle auf Ihrem Website-Frontend anzeigen möchten und gleichzeitig Ihre Serverressourcen beibehalten möchten. Wählen Sie auf jeder Seite eine voreingestellte Anzahl von Tabellenzeilen aus.
Es gibt auch eine offene Möglichkeit, Excel-Dokumente über den WP Table Manager Excel-Dateiimporter zu verwalten. Sie können Excel-Daten jedoch nur als bearbeitbare HTML-Tabelle importieren und transformieren oder die Excel-Datei mit ihrem Stil mit Farben, Hintergründen, Spaltengröße und Links importieren.
Verwalten Sie Ihre Excel-Tabelle und veröffentlichen Sie sie auf Ihrer WordPress-Website! Sie können eine Excel-Datei über die WordPress-Medienverwaltung oder einen FTP-Client in die Tabelle hochladen. Wählen Sie dann Ihre Excel-Datei aus und starten Sie die Synchronisation über die Tabelleneinstellungen.
Die Synchronisation zwischen Ihrer WordPress-Tabelle und der Excel-Datei kann regelmäßig zwischen einer Minute und einem Tag erfolgen. Die automatische Synchronisierungsverzögerung kann auch definiert werden, um unerwünschte öffentliche WordPress-Tabellenupdates zu vermeiden oder Serverressourcen für eine riesige Tabelle zu sparen.
Nach dem Importieren einer Tabelle können alle Daten aktualisiert werden; Dies ist nur eine gewöhnliche HTML-Tabelle, die wie ein plugin bearbeitet plugin ! WordPress-Tabelle.
Auf der anderen Seite, nachdem eine ordentliche Tabelle mit allen den Aufbau der Daten , die Sie möchten, können Sie es als eine herkömmliche Excel - Datei exportieren kann und für die Ex - amp le, re-run später die aktualisierte Excel - Sheet. Ihre Benutzer können die Tabelle nun als Excel-Tabelle auf dem WordPress-Frontend exportieren.
Der WP Table Manager synchronisiert sich auch mit Office 365 über OneDrive.
Das Tool zum Importieren und Exportieren von OneDrive-Excel-Dateien ist verfügbar. Sparen Sie Zeit, indem Sie Ihre Dateien während der Fahrt importieren und ändern. Seien Sie noch produktiver mit der OneDrive-Dateisynchronisierung! Wählen Sie eine Office 365 Excel-Datei zum Synchronisieren aus, passen Sie sie automatisch an und sie ist live auf Ihrer Website.
WP Table Manager hilft Ihnen beim Erstellen und Importieren von Registerkarten aus der Datenbank; es enthält jetzt ein Tool zum Generieren von Tabellen aus einer Auswahl von Website-Datenbankinhalten, die zuvor nicht verfügbar war. Tabellen und Spalten aus der Datenbank werden ausgewählt, konfigurierbare Filter angewendet und Tabellen werden über die WP Table manager Oberfläche verwaltet. Wenn die Datenbank aktualisiert wird, wird Ihre Tabelle automatisch inkrementiert! Darüber hinaus stehen Ihnen Sortier-, Filter-, automatische Gestaltungs- und Paginierungsoptionen zur Verfügung.
Wenn Sie kein Entwickler sind, können Sie beliebiges Datenbankmaterial visuell mit Ihrer HTML-Tabelle verbinden. Alle Tabellen in Ihrer Datenbank werden präsentiert, während eine neue Tabelle aus dem Datenbankinhalt generiert wird.
Ihre Website-Datenbank kann eine einfache Suche durchführen und Ihre Tabellen und Spalten auswählen; Dies ist in einer riesigen Datenbank ziemlich nützlich. Außerdem hilft Ihnen ein Assistent Schritt für Schritt mit der Tabelle aus der Datenbank.
In der letzten Phase können Sie vor der Vorschau der Tabelle aus der Datenbank Ihre benutzerdefinierte Abfrage in die angegebenen Datenbanktabellen schreiben. Wir unterstützen einige Funktionen wie SELECT, REPLACE, RENAME, SHOW, EXPLAIN, DESCRIBE.
Eine Datenbanktabelle enthält manchmal viele Zeilen; Daher kann diese Option helfen, eine Tabelle anzuzeigen, die in Ihren Bildschirm passt. Außerdem können Sie für jede Seite eine vordefinierte Anzahl von Zeilen der Tabelle festlegen. Darüber hinaus können Sie auch eine Spalte auswählen, um die gesamte Tabelle standardmäßig zu sortieren.
Die Verbindung mit WordPress-Datenbanktabellen ist nicht nur auf WordPress-Tabellen beschränkt. Alle Tabellen, die nicht von WordPress stammen, aber auf derselben Datenbank installiert sind, können verbunden werden.
Unter den riesigen Datenmengen in Ihrer Tabelle können Sie einige benutzerdefinierte Regeln erstellen, um sich auf ein bestimmtes Objekt zu konzentrieren. Wenn Sie damit vertraut sind, können Sie mit den Datenbankoperatoren wie >, <, LIKE, IN… spielen.
Die Tabellen aus der von Ihnen erstellten Datenbank können wie alle anderen Tabellen bearbeitet werden (wenn der Benutzer Zugriff auf diese sinnvolle Funktion hat) (wenn der Benutzer Zugriff auf diese praktische Funktion hat); das ist ziemlich bequem einige Datenbankdaten , wie zum Ex Batch bearbeiten amp le, mehrere Post-Veröffentlichungstermine , die eine Weile , wenn done eins nach dem anderen genommen hätte.
Fazit
Tabellen sind eine der effektivsten Möglichkeiten, eine Reihe von Informationen zu präsentieren. Für eine weniger technisch versierte Person ist das Erstellen von Tabellen auf einer Webseite jedoch eine Herausforderung. Mit diesen plugin können Sie in wenigen einfachen Schritten Tabellen erstellen, die auf jedem Gerät lesbar sind. Darüber hinaus sorgen responsive Tabellen für positive Gesamterlebnisse für Ihre Website-Besucher. Probieren Sie es aus und teilen Sie uns Ihre Erfahrungen im Kommentarbereich unten mit.
