speedcache /cache/css/sc_6811039f6a9b8003248b6b1853f5920f.css "rel =" stylesheet "/>Droptables : Styling Table

Droptables : Styling Table

1. Formater fanen

Formatfanen er tilgjengelig til høyre på skjermen som standard. Den inneholder forskjellige stylingsparametere.

 

table-format

 

  • Celletype: standard eller HTML (med redaktør). Standardtypen lar deg gjøre beregning med den HTML som setter inn HTML-innhold som bilder.
  • Cellebakgrunnen handler om å definere bakgrunnsfarge selvfølgelig
  • Alternativ for kant og skrift kan brukes på enkelt- eller flere celler
  • Rad og kolonne bredde / høyde kan defineres i piksler. Velg kolonne eller rad hvor som helst i tabellen og bekreft størrelse.

 

rad-kolonne-format

 

En verktøytips på musemekst er også tilgjengelig (må aktiveres fra komponentalternativer). Ved å klikke på verktøytipsknappen kan du redigere innholdet som er synlig på musemarkøren på frontend.

 

Tabellen-celle-tooltip

 

2 . Tema- og sorteringsalternativer

Bord fanen, fremdeles på høyre side, du har en temavelger for miniatyrbilder. Bare klikk på et tema for å bruke det. Vi anbefaler på det sterkeste å bruke temaer på ferske tabeller, det er virkelig enklere å endre data da.

 

tema-valg

 

Hvis du allerede har data i tabellen din og bruker et tema, blir alle dataene fjernet. Hvis du bruker et tema på en ny tabell, legges eksempeldata og stil til og kan redigeres.

 

Fortsatt i tabellen til høyre kolonne er parameteren for 2 rammer her for å definere fargen på alternative linjer (linje1, linje2, linje1, linje2 ...)

 

to-ramme

 

Den sorterbare parameteren lar deg lage AJAX-datasortering på frontend. Merk at hvis du aktiverer filterverktøyet, vil et datasorteringsverktøy være aktivert som standard.  

 

sorterbar-og-filter tabell

 

  • Bruk sorterbar tabell: Ja Nei
  • Juster bord: Sentrum / Høyre / Venstre / Ingen
  • Responsiv type: Rulle / gjemme kolleger
  • Aktiver filtre: Ja Nei
  • Aktiver paginering: Ja Nei
  • Antall rader per side: 10, 20, ...
  • Sorter en ordning som standard: Velg A, B eller C, ...
  • Ordre sortere en kolonne som standard: ASC / DESC

Datafilter og sorter på frontend

 

data-filteret

 

Tabelljusteringen handler om å justere div som inneholder hele tabellen, sentrer hele tabellen for eksempel. Alternativet for frysing av kolonne og linje fryser valget og aktiverer en rulle på resten.

 

linje-fryse

 

Gjør tabellene mine responsive eller bruker du bla på små enheter?

Droptables 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).

 

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)

 

responsive-table-cololumn-hide

 

En cellehightlight er også tilgjengelig som ekstrautstyr. Du kan aktivere denne funksjonen i  konfigurasjon. Den er deaktivert som standard. Du kan justere farge og uklarhet når det gjelder utheving.

 

Tabellen utheving

 

3 . ACL og Frontend administrasjon

Det er mulig å administrere tabellene dine fra Joomla frontend. Fra Joomla menysjef,  legg til en ny meny element og velg som type Administrer tabeller og velg Droptables frontend som mal.

 

meny- droptables

 

 

Dette er hva du kan se Droptables Manager fra frontend.

 

Droptables -frontend

 

Merk: For å vise tabellbehandlingsgrensesnittet med full skjerm på frontend, bør du velge Droptables > Droptables frontend.

 

Du kan bruke Joomla User Group ACL til å kontrollere handlingene i tabellutgaven. For det første, for å konfigurere hvem som har lov til å se tabeller, må du aktivere Aktiver Droptables (ACL) -funksjon i Droptables konfigurasjon.

 

frontend-table-utgave

 

I tillegg kan du kontrollere synet på bordfronten for hver tabell fra tabellinnstillingene (Mer fane). Hent en Joomla brukergruppe for å tillate en gruppe å se bordet på frontend.

 

bruker-gruppe-acl

 

4 . Tilpasset CSS

La oss gå ett skritt utover. Hvis du er en webdesigner med ferdigheter i CSS-utgave, kan du legge til css fra  den høyre Mer-fanen.

Du kan legge til polstring og kantradius på cellen.

 

padding-css

 

Celler, linje, kolonner har koordinater for å identifisere hver enkelt og anvende tilpassede css på den. R er rad, C er kolonne. Her er det rad 1 (r1), kolonne 4 (c4) = dtr1 dtc4

 

css-koordinater

 

CSS-koden er farget med kodespeil. CSS-koden kan være mindre kode, den fungerer også!

 

css-custom-tabellen