WP Table Manager : Styling von Tabellen

1. Formatieren

Die Registerkarte Format ist standardmäßig rechts auf Ihrem Bildschirm verfügbar. Es enthält verschiedene Parameter.

 

image31

 

  • Zelltyp: Standard oder HTML. Mit dem Standardtyp können Sie den HTML-Code berechnen und HTML-Inhalte wie Bilder einfügen. Ein WYSIWYG-Editor für jede Zelle wird in der nächsten Version implementiert, sobald Sie der Zelle HTML hinzufügen.
  • Zellenhintergrund Farbe: Hintergrundfarbe natürlich definieren

 

image32

 

Rahmen und Schriftartenoptionen können auf einzelne oder mehrere Zellen angewendet werden

 

image33

 

Die Zeilen- und Spaltenbreite kann in Pixel definiert werden. Wählen Sie eine beliebige Spalte oder Zeile in der Tabelle aus und überprüfen Sie die Größe.

 

2 . Themen- und Sortieroptionen

Auf der Registerkarte "Tabelle", die sich noch im rechten Teil befindet, haben Sie eine Themenauswahl. Klicken Sie einfach auf ein Thema, um es anzuwenden.

Durch Anwenden eines Themas werden alle Daten und Stile in Ihrer Tabelle ersetzt. Der Weg, um fortzufahren, besteht darin, ein Thema anzuwenden, Daten zu bearbeiten, ein eigenes Thema zu erstellen und dann Ihre Tabellen zu duplizieren.

 

Themenwahl

 

Die "Automatische Styling-Funktion: hilft Ihnen, die Linie auf Ihrem Tisch mit zu färben Header-Styling und Fußzeilen-Styling Optionen. Sie können die Vorlagenstile auswählen oder Ihre eigenen in den Plugin-Einstellungen erstellen.

 

image35

 

Mit dem sortierbaren Parameter können Sie AJAX-Daten im Frontend sortieren.

 

image36

 

Bei der Tabellenausrichtung geht es darum, das Div auszurichten, das die gesamte Tabelle enthält, z. B. die gesamte Tabelle zu zentrieren.

 

image37

 

Optional ist auch ein Zellenlicht erhältlich. Sie können diese Funktion in der Konfiguration aktivieren. Es ist standardmäßig deaktiviert. Sie können die Farbe der Hervorhebungszeile und die Deckkraft der Hervorhebung auswählen.

 

Tabellen-Highlight

 

3 . Tooltip für Zellen hinzufügen

Zellen-Tooltips müssen über die Plugin-Konfiguration aktiviert werden (Konfigurationsmenü). Nach der Aktivierung erhalten Sie eine Schaltfläche am unteren Rand des Format Registerkarte während der Tabellenausgabe.

 

image39

 

Sie können für eine Breite in Pixel. Der Bearbeitungs-Tooltip bringt Sie zu einem Tooltip mit einem Editor, um den Tooltip zu bearbeiten.

 

Tooltip-Editor

 

Fügen Sie Inhalte hinzu und speichern Sie, Sie sind fertig. Der Tooltip wird auf der öffentlichen Seite mit dem Mauszeiger angezeigt.

 

Tooltip-Hover

 

4 . Einfrieren von Linien und Säulen

Das Einfrieren von Linien oder Säulen ist in der verfügbar Tabelle Tab. Sie können bis zu 5 Zeilen oder Spalten einfrieren. Es wird ab der ersten Zeile / Spalte gezählt.

 

Einfrierlinie

 

Zum Einfrieren von Zeilen gibt es eine zusätzliche Option, mit der Sie die Höhe der Tabelle festlegen können (da Ihr Tabellencontainer möglicherweise eine unendliche Höhe hat).

 

Einfrierreihe

 

Wenn Sie die einzufrierende Zeile oder Spalte ausgewählt haben, können Sie in Ihrer Tabelle scrollen und immer die festen Zeilen anzeigen.

 

Festnetzanzeige

 

5 . Spaltendaten filtern

Eine Filteroption ist wieder auf der Registerkarte Tabelle verfügbar. Sie können es aktivieren, um öffentliche Datenfilterfelder zu aktivieren.

 

Filtersäule

Beispiel für Filter:

 

Responsive-Table-Scroll

 

6 . Benutzerdefinierte CSS

Gehen wir noch einen Schritt weiter. Wenn Sie ein Webdesigner mit CSS-Kenntnissen sind, können Sie CSS in der hinzufügen Registerkarte Mehr. Sie können der Zelle Auffüllung und Randradius hinzufügen.

 

image47

 

Beachten Sie, dass, wenn Sie ein Thema angewendet haben, einige benutzerdefinierte CSS automatisch hinzugefügt werden. Sie können es natürlich noch bearbeiten.

 

Immer noch auf der Registerkarte MehrKlicken Sie auf die benutzerdefinierte CSS-Schaltfläche um auf die CSS-Edition zuzugreifen. Der CSS-Code wird mit Code Mirror eingefärbt und kann in weniger CSS geschrieben werden, es funktioniert auch!

 

custom-table-css

 

Zellen, Linien und Spalten haben Koordinaten, um sie zu identifizieren und benutzerdefinierte CSS darauf anzuwenden. R ist Zeile, C ist Spalte.

 

CSS-Anzeige

 

7 . Responsive WordPress-Tabellen

Reagieren meine Tabellen oder verwenden Sie den Bildlauf auf kleinen Geräten?

WP Table Manager behandelt das reaktionsschnelle Design optional mit einem Prioritätswerkzeug. Standardmäßig ist die Reaktionsfunktion deaktiviert, es kommt zu einem Überlauf (was auf Mobilgeräten jedoch hervorragend funktioniert).

 

Reaktionsmodus

 

Der Reaktionsmodus ist erweitert. Sie können eine Priorität für das Ausblenden von Spalten in Mobilgrößen definieren. Wenn Spalten ausgeblendet sind, wird ein mobiles Menü mit Kontrollkästchen angezeigt, um das Ein- / Ausblenden von Spalten zu erzwingen.
Die Spaltengröße wird während der Tabellenausgabe festgelegt. Wenn die Größe aller Spalten für den Container zu groß ist, kommt es zu einem Überlauf, und Sie können problemlos auf Mobilgeräten scrollen.

Tabelle mit einer Schriftrolle (besser für eine kleine Anzahl von Spalten)

 

Responsive-Table-Scroll

 

Tabelle mit ausgeblendeter Spalte (besser für eine große Anzahl von Spalten)

 

57bb0cb0ac948

 

8 . Tabelle herunterladen

Um Ihre Tabelle für die Öffentlichkeit freizugeben, sollten Sie aktivieren Download-Button Option bei Registerkarte "Tabelle" auf der rechten Seite. Der Dateityp ist * .xlsx.

 

Download-Tabelle

 

9 . Seitennummerierung

Sie finden diese Funktion auf der Registerkarte Tabelle in jeder Tabelle. Aktivieren und wählen Sie die Anzahl der Zeilen aus, die auf einer Seite angezeigt werden sollen.

 

pagination-wptm