Ugrás a fő tartalomhoz

WP Table Manager : Styling Tables

1. Formátum

Az eszköztáron megadhatja a cella stílusát, például: betűtípus, betűméret, szövegstílus, cella háttérszíne, szövegszín, cella vízszintes és függőleges aligment, ... Alkalmazható egyetlen cellára vagy több cellára

 

style-asztal

 

Kiválaszthatja a táblázatszerkesztő százalékát. Ez azt jelenti, hogy nagyíthatja/kicsinyítheti a táblázatot, 50% és 200% között.

 

nagyítás-kicsinyítés

 

A sor magassága és oszlopszélessége pixelben definiálható. Nyissa meg a Menü Formátum > Oszlop/sorméret alkalmazása menüpontot, majd válassza az Oszlop átméretezése/Sor átméretezése . A felugró ablakban kiválaszthatja a tartományt, és beállíthatja a px oszlopokat vagy sorokat. kattintson a Kész gombra.

 

resize-oszlop

 

2. Témák és lehetőségek

Az egyes táblázatokban megtalálható a Témaválasztási lehetőség a Menü témában. Csak kattintson egy témára az alkalmazásához.

Téma alkalmazása minden adatot és stílust kicserél a táblázatban. Tehát a folytatás egy téma alkalmazása, majd az adatok szerkesztése a saját téma létrehozásához, majd a táblázatok másolása.

 

téma-választás

Alternatív színek

Ugyanazon a Menütéma > Alternatív színek pontban az „Automatikus stílus” funkció segít kiszínezni az asztal vonalát a Fejléc- és Láblécstílus opciókkal. Kiválaszthatja a sablonstílusokat, vagy elkészítheti sajátját a bővítmény beállításainál.

 

téma-alter-szín

 

Az alternatív színt pedig úgy távolíthatja el, hogy rákattint az "Eltávolítás >  Automatikus stílus eltávolítása" lehetőségre a jobb gombbal kattintva. Ezután a szín törlődik a megerősítést követően.

 

eltávolítás-alternatív-szín

 

Táblázat igazítás

A táblázat igazítása körülbelül a div igazítását jelenti, amelyek a teljes táblázatot tartalmazzák, például az összes táblázatot középre. Megtalálható a Menüformátum > Táblázatigazítás menüpontban .

 

asztal-align

A cellák kiemelése

Opcióként cellakiemelés is elérhető. Ezt a funkciót a konfigurációban engedélyezheti. Alapértelmezés szerint le van tiltva. Kiválaszthatja a kiemelési sort a kiemelés színének és átlátszatlanságának beállításához.

 

table-kiemelés

 

3. Adjon hozzá tippet a cellákhoz

A táblázat minden cellájában láthatja az Eszköztipp hozzáadása opciót, amikor jobb egérgombbal kattint rá.

 

add-tooltip

 

Az eszköztipp szélességét pixelben állíthatja be. Ez egy szerkesztővel ellátott szerkesztési útmutatóhoz vezet.

 

tooltip-szerkesztő

 

Adjon hozzá tartalmat, és mentse el, kész - az eszköztipp az egérmutatót a nyilvános oldalon jeleníti meg.

 

tooltip-hover

 

4. Sor- és oszlopfagyasztás

Oszlop fagyás

Menüformátum > Reszponzív beállítások menüpontban érhető el . Legfeljebb 5 oszlopot rögzíthet. Az első oszloptól számítják.

 

fagyasztóoszlop

 

A fóliák / sorok fagyasztásához van egy további lehetőség, amely lehetővé teszi az asztal magasságának rögzítését (mert az asztaltárolója végtelen magasságú lehet).

 

asztalmagasság

 

Ha kiválasztotta a rögzíteni kívánt oszlopot, görgethet a táblázaton, és mindig megjelenítheti a rögzített oszlopot.

 

fix-line-megjelenítő

 

Sorfagyás

Megtalálható a Menüformátum > Táblázat fejléce , innen lehet bekapcsolni az opciót és beállítani a sorok rögzítését (legfeljebb 5 sor).

 

row-freeze-table-header

 

Ha meg akarja állítani az asztal magasságát, kérjük, térjen vissza az Adaptív lehetőségekhez.

Ezután az első sor lefagy a frontenden a beállítást követve.

 

sorfagyasztás

 

5. Rendezés és szűrők

Ha rendezni vagy szűrni szeretné a táblázatot, lépjen a Menüformátum > Rendezés és szűrők lehetőségre.

 

válogatás-szűrő

 

Ezután megjelenik egy felugró ablak, amely rendezési és szűrési lehetőségeket tartalmaz. 

 

filter-sort-popup

 

Ha rendezni szeretne egy táblázatot, egyszerűen engedélyezze a Frontend rendezhetőségét . Kiválaszthat egy oszlopot az alapértelmezett rendezéshez és annak irányát.

Például ebben az esetben válassza ki az A oszlopot ASC irányú .

 

rendezési lehetőségek

 

2 lehetőség van a szűrésre:

 

filter-opciók

 

  • Oszlopon belül: az egyes oszlopok fejlécében szűrheti az adatokat. A váltógomb segít megjeleníteni vagy elrejteni a keresőmezőt a fejlécben.

 

szűrő-belül-oszlop

 

  • Speciális szűrési űrlap: az opció kiválasztása után egy táblázatban kereshet és szűrhet adatokat

 

fejlett szűrő

 

Fő keresés: Ha engedélyezi ezt a funkciót, egy keresési beviteli mezőt ad hozzá a kezelőfelülethez. Ez lehetővé teszi a felhasználók számára, hogy könnyen kereshessenek a táblázat összes adatában.

 

fő-keresés

 

6. Cellák kitöltése és szegélysugár

Az eszköztáron megtalálja a szegély ikont, amely segít beállítani a cellák kitöltését és szegély sugarát.

 

padding-határ

 

Ne feledje, hogy ha egy témát alkalmaz, akkor néhány egyedi css automatikusan hozzáadódik. Természetesen még szerkesztheti.

 

7. Egyéni CSS

Lépjünk egy lépéssel tovább. Ha Ön CSS-ismeretekkel rendelkező webdesigner, akkor a Menüformátum > Egyéni CSS menüpontban adhat hozzá css-t.

 

méret-custom-css

 

A CSS kódot kódtükör segítségével színezik, és kevesebb CSS-szel írható, ez is működik!

 

egyedi asztal-css

 

A cellák, a sor, az oszlopok koordinátákkal rendelkeznek, hogy azonosítsák mindegyiket és alkalmazzák az egyedi css-t rajta. R sor, C oszlop.

 

css-megjelenítő

 

8. Reszponzív WordPress táblázatok

A tábláim reagálnak-e, vagy használják-e a görgetést kis eszközökön?

Rejtett hűtők

WP Table Manager opcionálisan prioritási eszközzel kezeli a reszponzív tervezést. Alapértelmezés szerint a reszponzív funkció le van tiltva, túlcsordulás lesz (bár mobilon remekül működik). oszlopok elrejtése használatához lépjen a Menüformátum > Reszponzív beállítások menüpontra.

 

érzékeny-bujkáló-col

 

A reszponzív mód fejlett, mobilméretekben megadhatja az oszlopok elrejtésének prioritását.
Ha az oszlopok el vannak rejtve, megjelenik egy mobilmenü egy jelölőnégyzettel az oszlopok megjelenítésének/elrejtésének kényszerítéséhez. Az oszlopméret a táblázatszerkesztés során rögzítésre kerül. Ha az összes oszlop mérete túl nagy a tárolóhoz, akkor túlcsordulás lép fel, és könnyen görgethet mobileszközökön.

Táblázat görgetéssel (kisebb oszlopok esetén jobb)

 

reagáló-asztal-scroll

 

Táblázat oszlopokkal rejtett (nagy oszlopmennyiségnél jobb)

 

57bb0cb0ac948

 

Ismételt fejléc

Ez egy másik lehetőség, ha egy táblázatot szeretne beszúrni a webhely egy kis területére. Lépjen a Menüformátum > Reszponzív beállítások menüpontra. Ezután válassza az Érzékeny típus > Ismételt fejléc lehetőséget.

 

ismételt fejléc

 

Az igényei szerint testreszabási lehetőségek állnak rendelkezésre:

  • Reszponzív töréspont (px): Válasszon egy töréspont értéket pixelben annak meghatározásához, hogy a táblázat mikor váltson át erre az adaptív módra
  • Reszponzív maximális magasság (px): Ha az adaptív mód be van kapcsolva, a töréspont értékétől függően határozzon meg egy maximális magasságot a nagyon hosszú asztal elkerülése érdekében
  • Adaptív mód stílusa: Alapértelmezett stílus alkalmazása ehhez az adaptív módhoz, vagy használja a táblázat színeit

Ezt követően láthatja, hogy fog kinézni az asztal a frontenden.

 

Ismételt fejléc-frontend

 

az Ismételt fejléc használja és a Szűrés opció engedélyezve van, akkor a mobilnézetben a szövegmezőbe gépelve szűrhet.

 

filter-repeated-header

 

9. Exportálás Excelbe

A táblázat számítógépre mentéséhez lépjen a Táblázat menü menübe , és kattintson az Excel exportálása gombra . Ekkor a fájl típusa *.xlsx lesz a frontendre történő exportálás után.

 

export-excel

 

10. Lapozás

Ez a funkció minden táblázatkiadásban a Menüformátum > Lapozás menüpontban A váltógombbal engedélyezheti, és válassza ki az oldalon megjelenítendő sorok számát.

 

lapszámozás-wptm

 

11. Cellák szegélyének stílusa

A táblázathoz szegélytípusokat alkalmazhat, például szegélyszélességet, szegélyszínt vagy szegélystílust. Először válassza ki a cellatartományt, majd kattintson az ikonra az eszköztáron.

 

határos stílusban

 

12. Táblázat nyomtatása a frontendre

Néha ki kell nyomtatnia a táblázatot. Tehát ahhoz, hogy a Nyomtatás gomb a kezelőfelületen, először navigáljon a Menütáblázathoz, és jelölje be a Nyomtatás gombot.

 

nyomtatási gomb