WP Table Manager : Styling Tables

1. Formaat

Het opmaaktabblad is standaard beschikbaar aan de rechterkant van uw scherm. Het bevat verschillende parameters.

 

afbeelding31

 

  • Type cel: standaard of HTML. Met het standaardtype kunt u hiermee de HTML berekenen door HTML-inhoud zoals afbeeldingen in te voegen. Een WYSIWYG-editor voor elke cel wordt geïmplementeerd in de volgende versie, op het moment dat je HTML in de cel toevoegt.
  • Cel achtergrond kleur: natuurlijk achtergrondkleur definiëren

 

afbeelding32

 

Randen en lettertype-opties kunnen worden toegepast op enkele of meerdere cellen

 

afbeelding33

 

De rij- en kolombreedte kan worden gedefinieerd in pixels. Selecteer een kolom of rij ergens in de tabel en valideer de grootte.

 

2 . Thema- en sorteeropties

Op het tabblad, nog steeds aan de rechterkant, heb je een themakiezer. Klik gewoon op een thema om het toe te passen.

Door een thema toe te passen, worden alle gegevens en stijl in uw tabel vervangen. Dus de manier om door te gaan is om een ​​thema toe te passen en vervolgens gegevens te bewerken of om uw eigen thema te maken en vervolgens uw tabellen te dupliceren.

 

thema-keuze

 

De functie "Automatische styling: helpt u de lijn op uw tafel te kleuren Kopstijlen en Voettekststijl opties. U kunt de sjabloonstijlen selecteren of uw eigen stijlen maken bij plug-in-instellingen.

 

afbeelding35

 

Met de sorteerbare parameter kunt u AJAX-gegevens op frontend sorteren.

 

afbeelding36

 

De tabeluitlijning gaat over het uitlijnen van de div die de hele tabel bevat, centreer bijvoorbeeld de hele tabel.

 

afbeelding37

 

Optioneel is ook een celhooglicht leverbaar. U kunt deze functie inschakelen in de configuratie. Het is standaard uitgeschakeld. U kunt de rij markeren selecteren om de kleur en dekking van de markering aan te passen.

 

tafel hoogtepunt

 

3 . Voeg knopinfo toe aan cellen

Mobiele tooltips moeten worden geactiveerd vanuit de plugin-configuratie (Configuratiemenu). Na activering krijg je een knop onderaan de Formaat tabblad tijdens de tafeleditie.

 

afbeelding39

 

Je kunt voor een breedte in pixels. De knopinfo voor bewerken brengt u naar een tooltip met een editor om de tooltip te bewerken.

 

tooltip-editor

 

Voeg inhoud toe en sla op, je bent klaar, de tooltip wordt aan de openbare kant weergegeven bij muisaanwijzer.

 

tooltip-hover

 

4 . Lijn- en kolombevriezing

Lijn- of kolombevriezing is beschikbaar in de Tafel tabblad. U kunt maximaal 5 regels of kolommen vastzetten. Het wordt geteld vanaf de eerste rij / col.

 

freeze-lijn

 

Om het vastlopen van rijen te voorkomen, is er een extra optie waarmee u de hoogte van de tafel kunt bepalen (omdat uw tafelcontainer een oneindige hoogte kan hebben).

 

freeze-rij

 

Wanneer je de regel of kolom hebt gekozen die je wilt vastzetten, kun je op je tafel scrollen en altijd de vaste regel / rijen weergeven.

 

vaste lijn weergeven

 

5 . Kolomgegevens filteren

Er is weer een filteroptie beschikbaar in het tabeltabblad. U kunt het activeren om velden voor het filteren van openbare gegevens in te schakelen.

 

filterkolom

Voorbeeld van filters:

 

responsive-table-scroll

 

6 . Aangepaste CSS

Laten we een stap verder gaan. Als je een webdesigner bent met css-vaardigheden, kun je css toevoegen in de Meer tabblad. U kunt opvulling en randradius op cel toevoegen.

 

afbeelding47

 

Merk op dat als je een thema hebt toegepast, sommige aangepaste css automatisch zullen worden toegevoegd. Je kunt het natuurlijk nog steeds bewerken.

 

Nog steeds op de Meer tabblad, klik op de custom CSS-knop voor toegang tot css editie. De CSS-code is gekleurd met code mirror en kan in minder CSS worden geschreven, het werkt ook!

 

custom-table-css

 

Cellen, lijn, kolommen hebben coördinaten om ze allemaal te identificeren en er aangepaste css op toe te passen. R is rij, C is kolom.

 

CSS-weergave

 

7 . Responsieve WordPress-tabellen

Reageren mijn tafels of gebruik ik de scroll op kleine apparaten?

WP Table Manager behandelt het responsieve ontwerp met een prioriteitstool, als een optie. Standaard is de responsieve functie uitgeschakeld, er zal een overloop zijn (die werkt prima op mobiel).

 

responsieve modus

 

De responsieve modus is geavanceerd, u kunt een prioriteit definiëren voor het verbergen van kolommen op mobiele formaten. Wanneer kolommen zijn verborgen, wordt een mobiel menu met selectievakje weergegeven om het weergeven / verbergen van kolommen te forceren.
De kolomgrootte is vast tijdens de tafeleditie. Als de grootte van alle kolommen te groot is voor de container, heb je een overloop en kun je gemakkelijk scrollen op mobiele apparaten.

Tafel met een scroll (beter voor een klein aantal kolommen)

 

responsive-table-scroll

 

Tabel met verborgen kolom (beter voor een groot aantal kolommen)

 

57bb0cb0ac948

 

8 . Tafel downloaden

Om uw tafel met het publiek te delen, moet u inschakelen Download knop optie bij Tabblad Tab op het rechter paneel. Het bestandstype is * .xlsx.

 

download-tabel

 

9 . Paginering

U vindt deze functie op het tabblad Tabel in elke tabel. Schakel in en kies het aantal rijen dat op een pagina moet worden weergegeven.

 

pagination-wptm