WP Table Manager : Styling Tables

1. Formater

På verktøylinjen kan du angi stil for celle, for eksempel: skrift, skriftstørrelse, tekststil, bakgrunnsfarge for celle, tekstfarge, celle horisontal og vertikal aligment, ... Den kan brukes på en enkelt celle eller flere celler

 

style-tabellen

 

Radhøyde og kolonnebredde kan defineres i piksler. Gå til Menyformat> Bruk kolonne / linjestørrelse, og velg deretter Endre størrelse på kolonne / Endre størrelse på rad. I popup-vinduet kan du velge rekkevidde og angi px for kolonner eller rader. Klikk på Ferdig buton til slutt.

 

endre størrelse-kolonne

 

2 . Tema- og sorteringsalternativer

I hver tabell kan du finne Temavalg alternativ kl Menytema. Bare klikk på et tema for å bruke det.

Å bruke et tema vil erstatte alle dataene og stilen i tabellen din. Så måten å fortsette på er å bruke et tema og redigere data for å lage ditt eget tema og deretter duplisere tabellene.

 

tema-valg

 

På det samme Menytema> Alternative farger, hjelper funksjonen "Automatisk styling" deg med å fargelegge linjen på bordet ditt Header styling og Bunntekst styling alternativer. Du kan velge malerstiler eller lage dine egne ved plugin-innstillinger.

 

tema-alter-farge

 

Den sorterbare parameteren lar deg lage AJAX-datasortering på frontend. Du kan se på Menyformat> Sorter.

 

sort-tabellen

 

Tabelljusteringen handler om å justere div som inneholder hele tabellen, sentrer hele tabellen for eksempel. Du finner på Menyformat> Tabelljustering.

 

Tabellen-Juster

 

Et cellehøydepunkt er også tilgjengelig som et alternativ. Du kan aktivere denne funksjonen i konfigurasjonen. Den er deaktivert som standard. Du kan velge uthevingsrekkejuster farge og uklarhet på utheving.

 

table-høydepunkt

 

3 . Legg til verktøytips på celler

På hver celle på et bord kan du se alternativet Legg til verktøytips når du høyreklikker på det.

 

add-verktøytips

 

Du kan angi bredden på verktøytipen i piksler. Den fører deg til en verktøytips med en redaktør du kan redigere.

 

tooltip-redaktør

 

Legg til innhold og lagre, du er ferdig, verktøytipsen vises på offentlig side på musepekeren.

 

tooltip-hover

 

4 . Rad og kolonne fryser

Søylefrysing

Kolonnefrysning er tilgjengelig i menyen Format> Responsive alternativer. Du kan fryse opptil 5 kolonner. Det telles fra første kol.

 

fryse-linje

 

For å gjøre kol / rad frysing er det et ekstra alternativ som lar deg fikse høyden på bordet (fordi bordbeholderen din kan ha en uendelig høyde).

 

bordhøyde

 

Når du har valgt kolonnen som skal fryses, kan du bla på bordet ditt og alltid vise den faste kolonnen.

 

fix-line-visning

Radfrysing

Du finner den kl Menyformat> Tabelloverskrift, herfra kan du slå på alternativet og stille radene til å fryse (opptil 5 rader).

 

tabellhode

 

Hvis du vil stille inn bordhøyden, kan du snu tilbake til Responsive alternativer.

Deretter fryses første rad på frontend etter innstillingen.

 

radfrysing

 

5 . Filtrering av kolonnedata

Et filtreringsalternativ er tilgjengelig kl Menyformat > Filtre. Du kan aktivere det ved å klikke for å aktivere offentlige datafiltreringsfelt.

 

filter-kolonne

 

Eksempel på filtre:

 

responsiv-tabell-scroll

 

6 . Cellepolstring og grensradius

Du kan finne grenseikonet på verktøylinjen som hjelper til med å justere polstring og kantradius på cellen.

 

padding-grensen

 

Merk at hvis du har brukt et tema, vil noen tilpassede css legges til automatisk. Du kan fortsatt redigere det selvfølgelig.

 

7 . Tilpasset CSS

La oss gå ett skritt utover. Hvis du er en webdesigner med css-ferdigheter, vil du kunne legge til css på Menyformat> Tilpasset CSS. 

 

format-custom-css

 

CSS-koden er farget med kodespeil og kan skrives i mindre CSS, den fungerer også!

 

custom-table-css

 

Celler, linje, kolonner har koordinater for å identifisere hver enkelt og anvende tilpassede css på den. R er rad, C er kolonne.

 

css-visning

 

8 . Responsive WordPress tabeller

Er tabellene mine lydhøre eller bruker du bla på små enheter?

WP Table Manager håndterer responsiv design med et prioritert verktøy, som et alternativ. Som standard er den responsive funksjonen deaktivert, det vil være et overløp (heks fungerer imidlertid bra på mobil). For å bruke Gjemmer Cols alternativet, bør du gå til Menyformat> Responsive alternativer.

 

responsive-modus

 

Responsiv modus er avansert, du kan definere en prioritet for å skjule kolonner på mobilstørrelser. Når kolonner er skjult, vises en mobilmeny med avkrysningsrute for å tvinge frem visning / skjul av kolonner.  
Kolonnestørrelsen er fast under tabellutgaven. Hvis størrelsen på alle kolonnene er for stor for beholderen, har du et overløp, og du kan enkelt bla på mobile enheter.

Tabell med en rulle (bedre for en liten mengde kolonner)

 

responsiv-tabell-scroll

 

Tabell med kolonne skjult (bedre for en stor mengde kolonner)

 

57bb0cb0ac948

 

9 . Last ned tabellen

For å dele tabellen din til det offentlige, må du aktivere Last ned-knappen alternativ kl Tabell-fane på høyre panel. Filtypen vil være * .xlsx.

 

download-tabellen

 

10 . paginering

Du finner denne funksjonen på Meny> Format i hver tabell. Bruk vippeknappen for å aktivere og velge antall rader som skal vises på en side.

 

paginering-wptm