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

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ü 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.

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.