# Mobil menü widget: alkalmazásszerű menüsáv telefonra

> A Mobil menü widget beállításai: stílus, pozíció, töréspont, menüpontok, kiegészítő kapcsoló, megjelenítés, aktív oldaljelző, stíluslap és görgetés utáni megjelenítés.

A teljes fejlécmenü telefonon nehezen használható. A **Mobil menü** widget ezért telefonos alkalmazásokra emlékeztető menüsávot készít: ikonos és szöveges menüpontokból áll, kiemelhető rajta egy gomb (link vagy Elementor-sablon panel), és a képernyő aljához vagy tetejéhez rögzíthető.

A widget a Pro változat része. Az ingyenes bővítményben az elemek között zárolt ikonnal jelenik meg, és ha egy oldalon már van Mobil menü widget, de a Pro nincs bekapcsolva, az oldalon semmi sem látszik belőle.

## Mi kell hozzá

- Az Elementor és a bővítmény telepítve és aktiválva.
- A widget bekapcsolva a **The Plus Addons → Widgets** oldalon.
- Bármelyik oldalra tehető, de ha az összes oldalon látni szeretnéd, fejlécsablonba tedd (például az ingyenes Nexter Builderrel). A widget saját panelje is ezt javasolja.

## Bekapcsolás

1. Nyisd meg a **The Plus Addons → Widgets** oldalt.
2. Keress rá a **Mobil menü** widgetre, és kapcsold be.
3. Az Elementor szerkesztőjében a **Mobil menü** nevet keresd az elemek között.

## Tartalom lap

### Mobil menü szakasz

![A Mobil menü szakasz a stílusválasztóval és a pozíció beállításaival](./kepek/karuszell-navigacio-panel-mobil-menu.webp)

*A Mobil menü szakasz a stílusválasztóval és a pozíció beállításaival* (https://minta-bolt.hu/wp-admin/post.php?post=18&action=elementor)

A képen a **Stílus** két képe, a **Pozíció**, a **Rögzített pozíció** és a **Mobilmenü megnyitása** csúszka látszik.

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Stílus** | Két kép közül választasz. Az 1. stílus egyetlen sor menüpont. A 2. stílus osztott menü: az **1. menü** a bal, a **Menü 2** a jobb oldalra kerül. | 1. stílus |
| **Pozíció** | **Rögzített**: a sáv a képernyőhöz van rögzítve. **Abszolút**: ott marad, ahová a widgetet tetted, ezért az oldallal együtt elgörög. | Rögzített |
| **Rögzített pozíció** | A rögzített sáv helye: **Alul** vagy **Felül**. Csak **Rögzített** pozíciónál jelenik meg. | Alul |
| **Mobilmenü megnyitása** | A legszélesebb képernyő képpontban (0 és 1500 között), amelyen a sáv még látszik. A 767 azt jelenti, hogy a sáv 767 px-ig látszik, 768 px-től rejtve marad. Egyetlen érték van minden eszközre. Ha üresen hagyod, a sáv minden képernyőn megjelenik, az asztali gépen is. | Üres |

### 1. menü és Menü 2

Az **1. menü** négy alapelemmel indul, az **Elem hozzáadása** gombbal újabbakat veszel fel. A **Menü 2** szakasz csak a 2. stílusnál látszik, és a jobb oldali elemeket tartalmazza. A 2. menüben mentett elemek az 1. stílusra váltva elrejtve maradnak.

![Egy menüelem megnyitva az 1. menü szakaszban](./kepek/karuszell-navigacio-panel-mobil-menu-elem.webp)

*Egy menüelem megnyitva az 1. menü szakaszban* (https://minta-bolt.hu/wp-admin/post.php?post=18&action=elementor)

A képen az elem mezői láthatók: **Ikon kiválasztása**, **Ikon**, **Szöveg**, **Link** és **Jelölő szövege**.

| Mező | Mit csinál |
| --- | --- |
| **Ikon kiválasztása** | **Ikon** vagy **Kép**. Az ikon vagy kép alapból 30 px széles. |
| **Szöveg** | Az ikon alatti felirat. |
| **Link** | Hová vezet az elem. Mindig ugyanabban a lapon nyílik meg: a link beállításai közül az új ablakban nyitás és a nofollow nem érvényesül. A link nélküli elem billentyűzettel nem érhető el. |
| **Jelölő szövege** | Kis jelvény az elem sarkában, például a kosárban lévő darabszám. |

### Kiegészítő kapcsoló

Bekapcsolva kiemelt gomb kerül a sávra: az 1. stílusnál a sor végére, a 2. stílusnál középre.

- A **Kapcsolóikon kiválasztása**, az **Ikon** (vagy kép) és a **Szöveg** a gomb kinézetét adja.
- A **Tartalom** értéke **Link** vagy **Sablon**. A **Link** egy URL-t nyit meg. A **Sablon** egy Elementor-sablont nyit meg panelben, erről a [Mobil menü: felugró panel Elementor-sablonnal](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/karuszell-navigacio-mobil-menu-panel/) fejezet szól.

### Extra opciók

![Az Extra opciók szakasz a megjelenítés beállításaival](./kepek/karuszell-navigacio-panel-mobil-menu-extra.webp)

*Az Extra opciók szakasz a megjelenítés beállításaival* (https://minta-bolt.hu/wp-admin/post.php?post=18&action=elementor)

A képen a **Megjelenítés** választó, az **Aktív oldaljelző** kapcsoló és a **Rögzített szöveg túlcsordulása** lista látszik.

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Megjelenítés** | **Swiper**: oldalra húzható sáv. **Oszlopok**: az elemek egyenlő szélességen osztoznak a sávon. A kettő különbségét az [elrendezések fejezete](https://hub.hellowp.io/hu/plugins/theplus_elementor_addon/karuszell-navigacio-mobil-menu-elrendezesek/) mutatja. | Swiper |
| **Aktív oldaljelző** | Kiemeli azt az elemet, amelynek a linkje a megnyitott oldal. A **Stílus** értéke **Sor** vagy **Pont**. A sor esetén a **Pozíció** is kell (**Felül** vagy **Alul**): az alapértéknél nem rajzolódik vonal. | Ki |
| **Rögzített szöveg túlcsordulása** | A **Látható** érték megakadályozza, hogy a jelvényeket levágja az elem széle. Csak a 2. stílusnál hat. | Rejtett |

## Stílus lap

| Szakasz | Mit állít |
| --- | --- |
| **Ikon/kép** | Az ikon mérete és színe (normál és aktív), a kép mérete, szegélye, lekerekítése és árnyéka. |
| **Kiegészítő kapcsoló ikonja/képe** | A kiegészítő kapcsoló ikonja vagy képe (csak bekapcsolt kapcsolónál). |
| **Aktív oldaljelző** | A vonal szélessége, magassága és színe, vagy a pont mérete és színe. |
| **Menü** | **Külső padding**, **Menü szélessége**, **Menü magassága**, a felirat betűtípusa és színei, az elemek háttere, szegélye, lekerekítése és árnyéka normál és aktív állapotban. |
| **Kiegészítő kapcsoló** | A gomb szélessége vagy egyenlő mérete, az eltolása, háttere, szegélye, lekerekítése és árnyéka. |
| **Kiegészítő kapcsoló sablonja** | A sablonpanel: **Túlcsordulás**, **Belső padding**, háttér, a bezáró ikon pozíciója és színei, **Átfedés háttere**. |
| **Tartalom háttere** | Az egész sáv paddingje, háttere, szegélye, lekerekítése, túlcsordulása és árnyéka. |
| **Rögzített szöveg beállításai** | A jelvények paddingje, eltolása, szövegmérete, betűtípusa, színei és alakja. |
| **Extra opciók** | A **Mobilmenü görgetési eltolásának megjelenítése** kapcsoló és a **Felső görgetési eltolás értéke** mező. |

### A sáv megjelenítése görgetés után

A **Stílus** lap **Extra opciók** szakaszában kapcsold be a **Mobilmenü görgetési eltolásának megjelenítése** beállítást, és add meg a **Felső görgetési eltolás értéke** mezőt (alapérték 100 px). A sáv addig rejtve marad, amíg a látogató ennél lejjebb nem görget, és visszagörgetéskor újra eltűnik.

## Hogyan működik

- A rögzített sáv a képernyő teljes szélességét kitölti, akármilyen széles tárolóba tetted, és görgetéskor a helyén marad.
- Ha két Mobil menü widget van egy oldalon, az egyik kiegészítő kapcsolójának panelje nem nyitja meg a másikét.
- A **Haladó** lapon az Elementor szokásos beállításai vannak (margó, padding, reszponzív láthatóság, egyedi CSS), és a The Plus Addons **Megjelenítési feltétel** beállítása is.

## Korlátok

- Az elemek alapértelmezett ikonja nem jelenik meg az oldalon. Minden elemhez válassz ikont a könyvtárból.
- A **Link** módú kiegészítő kapcsoló link nélkül nem kattintható.
- Ha a kiegészítő kapcsoló panelének sablonja nincs közzétéve, a látogatók „Unauthorized Access” üzenetet látnak a panelben.
- Az alul rögzített sáv az oldal tetején ül, ezért az oldal legvégén eltakarja az utolsó sorokat. Hagyj helyet a tartalom alatt.
- Ha a Pro ki van kapcsolva, a widgetet tartalmazó oldalakon a menü egyáltalán nem látszik.

## Hibaelhárítás

**A menü asztali gépen is látszik.** Állítsd be a **Mobilmenü megnyitása** értékét, például 767-re.

**Az aktív oldaljelző nem mutat semmit.** A **Sor** stílusnál válassz **Pozíció** értéket (**Felül** vagy **Alul**). Azt is nézd meg, hogy az elem linkje pontosan az oldal címe-e.

**Az elemeknél csak szöveg látszik, ikon nincs.** Válassz ikont minden elemhez: az alapértelmezett ikon nem jelenik meg.