# Többoszlopos és teljes szélességű megamenü

> Hogyan építs több oszlopos megamenüt almenükből, és hogyan teheted a megamenü panelt az oldal teljes szélességűvé.

Egy megamenü panelje tetszőleges számú oszlopból és widgetből állhat. Ez a fejezet egy többoszlopos panel felépítését és a panel szélességének beállítását írja le.

## Követelmények

- Elementor és a JetMenu aktiválva.
- Egy főmenü, és a panelben megjelenítendő almenük (külön menüként).

## Többoszlopos megamenü készítése

A példában a panel négy oszlopos: két oszlop képet és gombot tartalmaz, két oszlop pedig egy-egy külön menüt listáz.

1. Nyisd meg a **Megjelenés → Menük** oldalt, és hozd létre a főmenüt, ha még nincs.
2. Hozz létre további menüket azokhoz az oszlopokhoz, amelyekben menülistát szeretnél. Mindegyiknek adj nevet, vedd fel a kívánt elemeket (oldalak, kategóriák, egyéni hivatkozások), és kattints a **Menü mentése** gombra. Ezeknek a menüknek nem kell menühelyet adnod.
3. Válaszd ki a **Menü kiválasztása szerkesztésre** listában a főmenüt.
4. Vidd az egeret arra a menüpontra, amelyiknek a panelt szánod, és kattints a **Settings** gombra.
5. Kapcsold be a **Use Mega content** kapcsolót, a **MEGA CONTENT TYPE** mezőben válaszd az **Elementor** értéket, mentsd (**Save**), majd kattints az **Open editor** gombra.
6. Az Elementor szerkesztőjében kattints a **+** gombra a terület közepén, és válaszd ki az oszlopok számát (a példában négy oszlopot).
7. Töltsd fel az oszlopokat:
   - az első oszlopba két **Kép** és két **Gomb** widget kerül (például az újdonságok és a legnépszerűbb termékek oldalára mutató gomb),
   - a másodikba egy **Kép** és egy **Gomb**,
   - a harmadikba egy **Címsor** és egy **Függőleges megamenü** widget, amelynek a **Menü kiválasztása** mezőjében az első külön menüt adod meg,
   - a negyedikbe szintén egy **Címsor** és egy **Függőleges megamenü** widget a második külön menüvel.
8. Kattints a **Közzététel** gombra.
9. Térj vissza a menüszerkesztőre, és kattints a **Menü mentése** gombra.

A **Függőleges megamenü** widget beállításait a [Függőleges megamenü](https://hub.hellowp.io/hu/plugins/jet-menu/megamenu-tipusok-fuggoleges/) fejezet írja le.

## A főmenü elhelyezése és ellenőrzése

1. Nyisd meg azt az oldalt vagy sablont (például a fejlécsablont), ahol a menü megjelenik.
2. Add hozzá a **Megamenü** widgetet, és a **Menü** listában válaszd ki a főmenüt.
3. Kattints a **Közzététel** gombra.
4. Nyisd meg az oldalt a weboldalon, és vidd az egeret a megatartalmú menüpont fölé: megnyílik a többoszlopos panel.

## Teljes szélességű megamenü

Alapértelmezés szerint a panel szélességét a menü konténere határozza meg. Ha azt szeretnéd, hogy a panel az oldal teljes szélességét kitöltse, egy olyan elem CSS-osztályát kell megadnod, amelyik az egész oldal szélességében fut.

### Az osztály megkeresése

1. Nyisd meg a weboldalt, amelyen a menü látszik.
2. A böngésző fejlesztői eszközeit (például a **További eszközök → Fejlesztői eszközök** menüből) nyisd meg, és kattints az elemvizsgáló ikonra.
3. Jelöld ki az oldal teljes szélességét kitöltő szakaszt, és másold ki a CSS-osztályát. Az osztály neve elé pontot kell tenni, például `.egyedi-szakasz`.

### A Megamenü widgetben

1. Nyisd meg az Elementorban a fejlécsablont vagy az oldalt, és jelöld ki a **Megamenü** widgetet.
2. Az **Elrendezés** részben a **Mega konténer szélességének típusa** mezőnél válaszd a **Szelektor** értéket.
3. Az alatta megjelenő **Egyéni szelektor** mezőbe írd be a kimásolt osztályt, ponttal az elején.
4. Kattints a **Frissítés** (vagy **Közzététel**) gombra, majd töltsd újra az oldalt: a panel kitölti a teljes szélességet.

![A Megamenü widget Elrendezés része, a Mega konténer szélességének típusa Szelektor, az Egyéni szelektor mezőben .elementor](./kepek/megamenu-tipusok-szelesseg-szelektor.webp)

*A Megamenü widget Elrendezés része, a Mega konténer szélességének típusa Szelektor, az Egyéni szelektor mezőben .elementor* (https://minta-bolt.hu/wp-admin/post.php?post=12&action=elementor)

A képen a **Mega konténer szélességének típusa** mező értéke **Szelektor**, és alatta megjelent az **Egyéni szelektor** mező.

A típus további értékei: **Tároló** (az oldal fő tárolójának szélessége) és **Tételek** (a szülő menüpontok együttes szélessége).

### A téma menühelyén

Ha a menüt a téma menühelyén jeleníted meg, a szélességet a **Crocoblock → JetPlugins Settings → JetMenu** oldal **Főmenü** részében, az **Elrendezés** szakasz **Mega konténer szélességének típusa** mezőjében állítod be. Válaszd a **Szelektor** értéket, és add meg ugyanazt a pontos CSS-osztályt. Mentsd a beállításokat, és töltsd újra az oldalt. A mezők leírását lásd: [A JetMenu beállításai](https://hub.hellowp.io/hu/plugins/jet-menu/beallitasok/).