Mobil menü: rögzített alsó sáv, húzható sáv és osztott menü

A Mobil menü widget három gyakori elrendezése: a képernyő aljához (vagy tetejéhez) rögzített sáv, a sok menüponthoz való húzható sáv, és az osztott menü középső gombbal. Mindhárom ugyanazzal a widgettel készül, csak a beállítások mások.

Előfeltétel: a Mobil menü widget be van kapcsolva a The Plus Addons → Widgets oldalon. Minden elemhez válassz ikont a könyvtárból, mert az alapértelmezett ikon nem jelenik meg az oldalon.

Rögzített alsó menüsáv

A képernyő aljához rögzített sáv a telefonos alkalmazásokhoz hasonlóan hüvelykujjal elérhető marad görgetés közben.

1. Add hozzá a Mobil menü widgetet, és válassz Stílus értéket.
2. A Pozíció legyen Rögzített (ez az alapérték).
3. A Rögzített pozíció legyen Alul (szintén alapérték). A Felül érték a képernyő tetejéhez rögzíti a sávot.
4. A Mobilmenü megnyitása értéke a legszélesebb képernyő, amely még látja a sávot, például 767 telefonokra. Szélesebb képernyőn a sáv rejtve marad.
5. Az 1. menü szakaszban (2. stílusnál a Menü 2 szakaszban is) vedd fel az elemeket: ikon vagy kép, Szöveg és Link. Tedd közzé az oldalt, és nyisd meg telefonon.

https://minta-bolt.hu/tp-kn4-mm-sav/

A képen a sáv az oldal aljához tapad, és a tartalom mögötte görög. A kosár elem sarkában a Jelölő szövege jelvény látszik.

Beállítás	Eredmény
Rögzített és Alul (alapérték)	A képernyő aljához rögzített, a teljes szélességet kitöltő sáv, görgetéskor a helyén marad.
Rögzített és Felül	A képernyő tetejéhez rögzített, a teljes szélességet kitöltő sáv.
Abszolút	A widget helyén marad, a tárolója szélességében, és az oldallal együtt elgörög.

Tudnivalók:

• A Mobilmenü megnyitása egy felső határ és egyetlen érték minden eszközre. Ha üresen hagyod, a sáv minden képernyőn látszik.
• A rögzített sáv az oldal tetején ül, ezért hagyj helyet a tartalom alatt, hogy semmi fontos ne bújjon a sáv mögé.
• A Felül értéknél a bejelentkezett felhasználók addig a WordPress eszköztárát látják a sáv fölött, amíg nem görgetnek. A látogatókat ez nem érinti.

Húzható (Swiper) sáv

Ha több menüpont van, mint amennyi a telefon képernyőjének szélességében elfér, az oldalra húzható sáv minden elemet olvasható méretben tart.

1. A Mobil menü szakaszban hagyd az 1. stílust, és válassz Pozíció értéket.
2. Állítsd a Mobilmenü megnyitása értékét, például 767-re.
3. Az 1. menü szakaszban vegyél fel a telefon szélességénél több elemet.
4. Az Extra opciók szakaszban a Megjelenítés legyen Swiper (az alapérték). Tedd közzé az oldalt, és nyisd meg telefonon.

A sáv első elemei látszanak, a többit oldalra húzással éred el. A fenti kép egy tizenkét elemes húzható sávot mutat 390 px széles képernyőn: az utolsó látható elem már félig kilóg.

Megjelenítés	Amit a látogató lát
Swiper (alapérték)	Az elemek megtartják a szélességüket (alapból 70 px), és oldalra görgethető sávot alkotnak. Kevés elemnél a sáv nem tölti ki a teljes szélességet.
Oszlopok	Az elemek egyenlő szélességen osztoznak a sávon. Sok elemnél új sorba törnek, ami magasabbá teszi a sávot.

https://minta-bolt.hu/tp-kn4-mm-oszlop/

A képen a tizenkét elem két sorba tört, ezért a sáv jóval magasabb, mint húzható módban.

• A sáv követi az ujjat, és az elengedés után még kicsit mozog, így a hosszú menüben is végig lehet pörgetni.
• A Swiper szkript csak akkor töltődik be, ha a Megjelenítés értéke Swiper.
• A 2. stílusnál (osztott menü) a bal és a jobb oldal külön húzható sáv lesz.
• Az Aktív oldaljelző a megnyitott oldal elemét jelöli, húzás közben nem változik.
• Nincs nyíl vagy pont a lapozáshoz: a nem látszó elemekhez húzni kell.

Osztott menü középső gombbal

Az osztott menü bal oldalon és jobb oldalon is tart pár linket, középen pedig egy kiemelt gombot, mint a telefonos alkalmazások fülsávja.

1. A Mobil menü szakaszban válaszd a második képet, a 2. stílust.
2. Hagyd a Pozíció értékét Rögzített, a Rögzített pozíció értékét Alul.
3. Állítsd be a Mobilmenü megnyitása értékét, például 767-et. Ha üres marad, a sáv a táblagépen és az asztali gépen is látszik.
4. Az 1. menü szakaszban vedd fel a bal oldal elemeit: ikon vagy kép, Szöveg, Link. Oldalanként két elem jól működik.
5. A Menü 2 szakaszban vedd fel a jobb oldal elemeit. Ez a szakasz csak a 2. stílusnál látszik.
6. A Kiegészítő kapcsoló szakaszban kapcsold be a kapcsolót, adj neki ikont és Szöveg értéket, majd a Tartalom értékével válaszd ki a működését: Link vagy Sablon.
7. Az Extra opciók szakaszban állítsd a Megjelenítés értékét Oszlopok-ra, hogy az elemek egyenletesen töltsék ki a szélességet. Tedd közzé az oldalt, és nyisd meg telefonon.

https://minta-bolt.hu/tp-kn4-mm-split/

A képen balra a Főoldal és a Bolt, középen a Kosár kiegészítő kapcsoló, jobbra a Kedvencek és a Fiók látszik.

Tudnivalók:

• Oszlopok módban az elemek és a középső gomb egyenlő részeken osztoznak. Egy 390 px széles telefonon a két-két elem és a gomb öt, egyenként 78 px széles részt ad. Kiegészítő kapcsoló nélkül mindkét oldal a képernyő felét kapja.
• Swiper módban mindkét oldal külön húzható sáv 70 px-es elemekkel, ami üres helyet hagy, ha egy oldalon kevés elem van.
• A kinézetet a Stílus lapon állíthatod: a Menü szakasz az elemek színeit, betűtípusát és hátterét, a Kiegészítő kapcsoló a középső gombot, a Tartalom háttere magát a sávot.
• A 2. stílusnál a jelvény (Jelölő szövege) levágódik az elem szélén, amíg az Extra opciók → Rögzített szöveg túlcsordulása értékét Látható-ra nem állítod.

Hibaelhárítás

A menü asztali gépen is látszik. Állítsd a Mobilmenü megnyitása értékét arra a legnagyobb szélességre, ahol látszania kell, például 767-re.

A sáv elgörög az oldallal. A Pozíció Abszolút. Állítsd Rögzített-re.

Az elemeknél csak szöveg látszik. Válassz ikont minden elemhez az 1. menü szakaszban.

Nincs Menü 2 szakasz. A Menü 2 csak a 2. stílusnál jelenik meg.

Az elemek nem töltik ki a sávot. Kevés elemnél állítsd a Megjelenítés értékét Oszlopok-ra.

A sáv két sorra nőtt. Az Oszlopok megjelenítés sok elemnél új sorba tör. Válts Swiper-re, vagy vegyél ki elemeket.