How to create Mega Menu
Last updated
Last updated
To create the mega menu, please follow the steps:
Step 1: Go to Admin Dashboard -> Select Mega Menu from the left sidebar -> Add new
Step 2: Enter the name of the menu -> Select Template " Elementor Canvas " -> Click Publish to save it. And then, select Edit with Elementor to edit the menu.
Step 3: In Elementor, Click the button Add New Section -> Then, select the structure that you want to set up for the mega menu.
Step 4: If you want to add an image product category in the menu: Select " Product Category " and drag it to the position that you want.
Next, Select Content -> Select Style of category -> Select Category.
Then, Click the button " Show Image " -> Choose Image of category -> Choose size mode or Custom Height of the image that you want.
If you want to customize the style for the category, you can select the tab Style, or if you want to customize padding/ margin... you can select the tab Advanced.
Step 5: If you want to add a list menu:
First: you need to create the primary menu
Next, You need to add a list menu title. In Elementor, select " Heading" or " Modern Heading" to add a title and drag it to the position that you want. Then Add your heading title -> Select HTML Tag -> Customize Style/Advanced of Heading.
Then, add a list menu: In Elementor -> Select Morden Menu and drag it to the position that you want. In the Tab Content, you need to choose the primary menu that you created before. And select the tab Style/Advanced to customize the list menu.
Step 6: If you want to add a background color, image... to the menu. Click Edit Section -> Select the tab Style -> Background -> Background Type -> Select Classic -> Choose the color or image... that you want to add to the menu.
Step 7: After you have finished, click Update to save your menu.
Step 8: To display your menu on your site. Go to Admin dashboard -> Select Appearance -> Menus
Step 9: Select options Mega Menus in the tab Add menu items -> Choose the mega menu that you created before -> Select Add to Menu -> and drag it to the position that you want -> And click Save Menu to save.