MagyarmagyarTáblázat: keresés, rendezés, sorok száma és mobil nézet
A Táblázat widget kereshetősége, rendezhetősége, a látható sorok korlátozása és a két mobil elrendezés.
Mind a négy funkció ingyenes, és az Extra beállítások szakaszban kapcsolod be a Táblázat widgetnél (Tartalom fül). A widget bekapcsolását és a szakaszokat az alapok fejezet írja le.
Keresés a táblázatban
Szekció neve “Keresés a táblázatban”A Táblázat kereshetősége keresőmezőt tesz a táblázat fölé. Gépelés közben a nem egyező sorok eltűnnek.
- Add hozzá a Táblázat widgetet, és töltsd ki a táblázatot.
- Nyisd meg az Extra beállítások szakaszt.
- Kapcsold be a Táblázat kereshetősége kapcsolót.
- A Keresőmező felirata mezőbe írd a keresőmező előtti szöveget, például „Keresés a termékek között:”. Alapértelmezés: „Search”.
- Tedd közzé az oldalt, és próbáld ki a keresést a nyilvános oldalon.
A kép az „iroda” keresés eredményét mutatja: csak a három irodai sor maradt.
Hogyan működik:
- A keresés minden oszlopot átnéz, és nem tesz különbséget kis- és nagybetű között.
- Több szó szűkíti a találatot: csak az a sor marad, amelyik mindet tartalmazza.
- Ha nincs találat, a táblázat a „No matching records found” üzenetet mutatja.
- A mező kiürítése után minden sor visszatér.
- A keresőmező a szerkesztő előnézetében is megjelenik.
Korlátozások:
- Összevont cellákat (Oszlopok átfogása, Sorok átfogása) tartalmazó táblázatban a keresés nem működik.
- Plus űrlap forrásnál a beállítás nem érhető el.
- A keresőmezőnek nincs helyőrző szövege, a „No matching records found” üzenet pedig nem módosítható a widgetből.
Ha a keresőmező nem jelenik meg, ellenőrizd, hogy be van-e kapcsolva a Táblázat kereshetősége, és nézd a közzétett oldalt. A megjelenését a Stílus fül Keresősáv és megjelenített bejegyzések szakaszában állítod: felirat- és beviteli mezőszín, tipográfia, térköz, szegély, szélesség.
Rendezés
Szekció neve “Rendezés”A Táblázat rendezhetősége rendezőnyilat tesz minden oszlopfejlécbe, és egy kattintás rendezi az oszlopot. Fejlécsor kell hozzá: a rendezés az első fejlécsort használja.
- Add hozzá a Táblázat widgetet, és töltsd ki a táblázatot.
- Az Extra beállítások szakaszban kapcsold be a Táblázat rendezhetősége kapcsolót.
- Tedd közzé az oldalt, és próbáld ki egy fejléc kattintásával.
A kép az Ár (EUR) oszlop szerinti rendezést mutatja: a 119 a 25 és a 29 előtt áll, mert a rendezés szövegként hasonlít. A fejlécben a nyilak helyén nincs ikon, mert a Font Awesome nincs betöltve az oldalon.
Hogyan működik:
- Egy kattintás növekvő, a második csökkenő sorrendbe teszi az oszlopot.
- Az oldal betöltésekor a sorok az első oszlop szerint A-tól Z-ig rendezve állnak, nem a megadott sorrendben. Ha egy adott oszlop szerinti kezdő sorrendet akarsz, tedd azt az oszlopot elsőnek.
- A rendezés együtt működik a kereséssel és a sorszámválasztóval. A sorszámválasztónál előbb az egész táblázat rendeződik, utána látszanak az első sorok.
Korlátozások:
- A számokat szövegként rendezi: a 29, 35 és 119 sorrendje 119, 29, 35. Az azonos számjegyszámú értékek (például 4,0 és 4,9 közti értékelések) helyesen rendeződnek. A pénznemjellel írt árak ugyanígy viselkednek.
- A rendezőnyilak Font Awesome 5 ikonbetűkészletet használnak, amit a widget magától nem tölt be. Ha az oldalon nincs, a fejlécben üres doboz látszik nyíl helyett, a rendezés viszont működik.
- Összevont cellák mellett a rendezés nem működik („DataTables warning” felugró ablak jelenik meg).
- A kezdő sorrend nem választható: a táblázat mindig az első oszlop szerint indul.
Ha a sorok más sorrendben állnak, mint a szerkesztőben, az az automatikus A-Z rendezés az első oszlopon; kapcsold ki a Táblázat rendezhetősége kapcsolót, ha az eredeti sorrend kell. Ha egy fejlécre kattintva nem történik semmi, a közzétett oldalon próbáld, és nézd meg, hogy nincs-e a táblázatban átfogott cella.
A látható sorok számának korlátozása
Szekció neve “A látható sorok számának korlátozása”A hosszú táblázat messze lefelé tolja az oldal többi tartalmát. A Bejegyzésszám-választó legördülő menü csak az első sorokat mutatja, és egy „Show … entries” legördülő menüt tesz a táblázat fölé, amivel a látogató megválasztja a sorok számát.
- Add hozzá a Táblázat widgetet, és töltsd ki a táblázatot.
- Az Extra beállítások szakaszban kapcsold be a Bejegyzésszám-választó legördülő menü kapcsolót.
- Tedd közzé az oldalt, és ellenőrizd a táblázatot.
A kép az alapállapotot mutatja: a választó fölül, alatta az első öt sor.
Hogyan működik:
- A táblázat 5 sorral indul, a legördülő menü 5, 10, 15 és „All” értéket kínál.
- Nagyobb szám választásával több sor látszik, az „All” az egész táblázatot megmutatja.
- Ha a Táblázat rendezhetősége vagy a Táblázat kereshetősége is be van kapcsolva, a rendezés és a keresés az összes soron dolgozik, nem csak a láthatókon.
- A szerkesztő előnézetében is a választó és az első 5 sor látszik, a többi sor el van rejtve, de a Táblázat törzse szakaszban megvan.
Korlátozások:
- Lapozó nincs: a widget elrejti a „Next” és az oldalszám-gombokat, így az 5-nél több sort csak nagyobb szám vagy „All” választásával érheted el (vagy kereséssel).
- A kezdő szám (5) és a legördülő menü értékei nem módosíthatók a widgetből.
- Összevont cellákat tartalmazó táblázatnál a beállítás nem támogatott.
Ha a látogatók nem találják a lejjebb lévő sorokat, kérd őket, hogy válasszák az „All” értéket, vagy kapcsold be a Táblázat kereshetősége kapcsolót. A legördülő menü megjelenését a Stílus fül Keresősáv és megjelenített bejegyzések szakaszában állítod (a felirat, a beviteli mező és a bejegyzésszám-választó szélessége).
Mobil nézet
Szekció neve “Mobil nézet”Az ötoszlopos táblázat ritkán fér el telefonon. A Reszponzív megjelenítés mobilon mezőnek két értéke van.
- Add hozzá a Táblázat widgetet, és töltsd ki a táblázatot.
- Az Extra beállítások szakaszban válaszd ki a Reszponzív megjelenítés mobilon mezőben a Reszponzív megjelenítés húzással (alapérték) vagy a Reszponzív megjelenítés soronként értéket.
- Tedd közzé az oldalt, és nézd meg telefonon, vagy a böngésző eszközválasztó nézetében 768 px alatt.
Reszponzív megjelenítés húzással
Szekció neve “Reszponzív megjelenítés húzással”A táblázat megtartja az oszlopait. Keskeny képernyőn a saját dobozában görgethető oldalirányba, így az oldal többi része nem mozdul.
A kép a jobb szélen levágott táblázatot mutatja: a többi oszlopot oldalra húzva éred el.
Reszponzív megjelenítés soronként
Szekció neve “Reszponzív megjelenítés soronként”768 px alatt a fejlécsor eltűnik, és minden sor kis blokká alakul. Minden cella mellett ott áll az oszlop neve, például „Ár (EUR)” és az érték. 768 px-től felfelé a normál táblázat jelenik meg.
A kép minden sort külön blokkban mutat: bal oldalon az oszlop neve, jobb oldalon az érték.
Az oszlopnevek stílusát a Stílus fül Fejléc reszponzív stílusa mobilon szakaszában állíthatod, ami csak a Reszponzív megjelenítés soronként kiválasztása után jelenik meg.
Korlátozások:
- A soronkénti nézet elrejti a fejlécsort, így a rendezőnyilak telefonon nem elérhetők. A keresőmező továbbra is működik.
- Az oszlopnevek csak az Egyéni forrásnál jelennek meg a blokkokban. CSV-fájl, Plus űrlap vagy SQL-lekérdezés forrásnál a sorok oszlopnevek nélkül kerülnek egymás alá.
- A váltópont rögzített (767 px), a widgetben nem módosítható.
Ha az asztali előnézeten is a blokkos nézet látszik, a váltás 767 px-nél van: tedd szélesebbre a böngészőt, vagy nézd az Elementor asztali nézetét. Ha a blokkokból hiányoznak az oszlopnevek, ellenőrizd a Tartalomtábla forrását: csak az Egyéni forrású táblázat ismétli meg a fejlécszöveget minden cellában.
Függőleges görgetősáv
Szekció neve “Függőleges görgetősáv”Hosszú táblázat könnyen elfoglalja az egész oldalt. A Táblázat függőleges görgetősávja rögzített magasságot ad a táblázatnak, és a sorok egy belső görgetősávval érhetők el. A funkció az ingyenes bővítményben is működik.
- Add hozzá a Táblázat widgetet, és töltsd ki a táblázatot.
- Nyisd meg az Extra beállítások szakaszt a Tartalom fülön.
- Kapcsold be a Táblázat függőleges görgetősávja kapcsolót.
- A Magasság (px) mezőbe írj értéket, például 250-et. Az eszköz ikonnal tableten és mobilon más magasságot is megadhatsz.
- Tedd közzé az oldalt, és görgess a táblázaton belül.
A képen a Táblázat függőleges görgetősávja be van kapcsolva, a Magasság (px) értéke 250.
Az oldalon a táblázat a megadott magasságnál véget ér, és a saját dobozán belül görgethető.
Hogyan működik:
- A táblázat doboza a megadott magasságot és egy függőleges görgetősávot kap. A magasság alatti sorokat a táblázaton belüli görgetéssel éred el.
- Ha bekapcsolod a funkciót, de a magasságot nem állítod át, a táblázat csak 100 px magas, ezért adj meg magasságot.
- A görgetősáv színe és szélessége a Stílus → Görgetősáv szakaszban állítható.
Korlátozások:
- A keresőmező és a sorok számát választó legördülő menü együtt görgetődik a sorokkal. Ha a Táblázat kereshetősége vagy a Bejegyzésszám-választó legördülő menü be van kapcsolva, ezek ugyanabban a görgethető területben vannak, ezért kicsúsznak a látómezőből, amikor a látogató lejjebb görget.
- A fejlécsor a sorokkal együtt görgetődik, nem marad rögzítve felül.
- A magasság az egész táblázatdobozra érvényes a sorok számától függetlenül, ezért egy rövid táblázat alatt üres hely maradhat.
Ha a táblázat a funkció bekapcsolása után apró, állítsd be a Magasság (px) értéket, mert nélküle a doboz 100 px magas. Ha a látogatók elveszítik a keresőmezőt, adj nagyobb magasságot, vagy kapcsold ki a görgetősávot, és a Bejegyzésszám-választó legördülő menüvel rövidítsd a táblázatot.
Készült: