In Magento 2, this Magento 2 Mega Menu comes with tons of powerful features. By Drag n Drop Features and tons of pre-made styles in Mega Menu, it helps to create a wide range of rich menus. It is very ease to setup, use & customization. One of the reasons why You Should choose Magento 2 Mega Menu on Landofcoder is that it supports to create 6 Types of Menus in Magento 2.
So in terms of our blog, we will show you 6 Styles to Create Magento 2 Menu:
Follow us! Let’s discover “How to Create Magento 2 Menu with 06+ Styles by Magento 2 Mega Menu Extension” – Landofcoder.
Note: This Blog ensures you Create Magento 2 Menu with style. You have to know these steps:
+ How to Create Simple Menu Magento 2 ?
+ How to Add Category Link to Menu in Magento 2 ?
Table of Contents
Being the first style in Magento 2, Anchor Text Menu in Magento 2 Mega Menu is the most simple style in both style and use.
Start to Create Magento 2 Menu with Anchor Text Menu Style:
You have 2 styles:
Add New Menu -> Fill General Menu Information:
Save & Continue Edit -> View it on Frontend to see How it Display.
Add New Menu -> Edit -> Insert Widget -Settings -> Update -> Save & Continue Edit
+ At General Settings:
Link Type: Category Link
Category: Choose The Category link you want to link -> Update
Content: Choose Dynamic Content Tab
At Subcategory (Child menu) and Click “Edit”
Main Content Type: Choose “Content”
Widget Type: Ves Megamenu: Products
Widget Options: Choose categoies: Select categories you want
Number of Item: 20
Enable: Yes
Number of Item per Column: 2
Margin: 1
Auto Width: Yes/No
Autoplay: Yes/No
Auto HoverPause: Yes/No
Show Dots Navigations: Yes/No
Show next/prev buttons: Yes/No
-> Insert Widget -> Update -> Save & Continue Edit
Child menu (Submenu) is the secondary menu. It is a list of choices that is part of another list of choices. If you enable the field “Is Group” is “Yes”, both menu & submenus items will be displayed in the same level.
Create New Menu -> Add Submenu – the same steps to create single menu in Magento 2
You need to add parent menu A -> Submenu (secondary menu) and child menu
And Edit menu A:
+ At Dropdown:
Set Width: 100%
And “Update”
At Menu 1:
Click Edit -> At General Information -> Is Group: Choose “Yes”
And “Update”
At Main content You can set 1 or 2: -> “Update -> Save & Continue Edit”
View How it Displayed at the Frontend.
Add New Menu -> Name Menu -> Update
-> At Main Content -> Choose “Main Content Type” = “Content”
4.1 Add Custom Menu with HTML Video:
Copy HTML VIDEO:
Choose HTML Element:
Insert Video HTML: -> Update -> Update
At Dropdown:
Width: 500px
Choose Alignment: From right menu
Classes: Pull-right
-> Update -> Save & Continue Edit
Add New Menu -> Name Product -> Update
Main Content -> Main Content Type: Choose Content
At Content HTML -> Insert Widget -> Widget Type: Choose Ves Mega Menu Products
Widget Options:
Choose Categories: All
Number Item: 20
On Owl Carousel Settings:
Item Settings:
Then Click ” Insert Widget” -> Update
-> Update -> Save & Continue Edit
Create New Menu -> Update -> Save & Continue Edit -> Update
Edit Menu -> Edit:
Main Content:
Main Content Type: Sub-categories
Parent category: Choose Category for Parent
Child Menu Column: 2
Dropdown:
+ Set Width: 400px
+ Alignment: From right Items
-> Update ->Â Save & Continue Edit
System -> Cache Management -> Sellect All -> Submit
This our blog “Create Magento 2 Menu with 06+ Styles easily by Magento 2 Mega Menu Extension – Landofcoder. We hope this blog helps you enrich your menu content & style.
Magento 2 Mega Menu Tutorials
Some other extensions you maybe interested in
Related Posts
Over the past 18 months, there have been more changes in the digital ecosystem than…
HVAC businesses within today's digital market need effective methods to increase their customer base and…
Human resource management is an important aspect in determining organizational success. However, the way human…
Most “best student experience apps ” lists recycle the same picks without evidence. We set…
Imagine late at night, you visit a SaaS website, exploring a tool that could potentially…
In 2021, when Google rolled out its Page Experience update, Core Web Vitals metrics officially…