# Mega menu

Watch Video: [Freshio Mega Menu - Create Mega Menus for Food Website in WordPress](https://www.youtube.com/watch?v=iohLsbTV3To)

{% embed url="<https://www.youtube.com/watch?v=iohLsbTV3To>" %}

**Step 1** - Navigate to manager Menu : **Apperance > Menu**.

**Step 2** - Choose Menu you want to show **Mega menu**.

**Step 3** - Click the button **Mega** to create **Mega menu** for Item. So this Mega menu will show when you hover over Item you choose to ad Mega menu.

![](https://3352170884-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MFZzX4YuzXw6bWeNqh8%2F-MFhRfnBHFx9m8D-WTz9%2F-MFhRsFmwMvTTU0dTp2-%2Fimage.png?alt=media\&token=86c07475-6754-49b6-8d23-5b56e5c998a2)

List Item Menu

**Step 4** - A popup window is displayed. You can settings it before building content **Mega menu**.

![](https://gblobscdn.gitbook.com/assets%2F-M0pIcnkwC6XUmoax49d%2F-M9Vv7iU4HmAAp2uIFPO%2F-M9WEphXH8jaDlV5s9Nt%2Fimage.png?alt=media\&token=5e1fa02f-b654-4705-a813-9c4d919b8642)

Popup settings Mega menu

(1) Select Icon to show in Item Menu.

(2) Settings color to icons.

(3) Click button **Edit Megamenu Submenu** to build **Mega menu**.

(4) Set Width for **Mega menu.**

&#x20;Note : Edits must be saved before you click **Edit Megamenu Submenu** to save your settings.

You can select custom class icon when select custom class for icon. Use font awesome icons class or your custom class then add style for icon.\
&#x20;

![Add custom class icon](https://3352170884-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MFZzX4YuzXw6bWeNqh8%2F-MMOcsNDPpTQtZdUXePS%2F-MMP4xnPWzZ7-k_ZWFB2%2Fmenu-icon-class.png?alt=media\&token=b9c684d0-6cb7-49e4-aaa0-cac597a31b2d)

**Step 5** - Click **Edit Megamenu Submenu** then a new window will appear. You can build **Mega menu** by **Elementor.** After finishing click Update and click .

![](https://gblobscdn.gitbook.com/assets%2F-M0pIcnkwC6XUmoax49d%2F-M9Vv7iU4HmAAp2uIFPO%2F-M9WJV8tzRfwqaZweaht%2Fimage.png?alt=media\&token=90521309-ea1b-4fa5-b653-e029d0e0d689)

Window building Megamenu

**Step 6** - Click Save Menu.

![](https://gblobscdn.gitbook.com/assets%2F-M0pIcnkwC6XUmoax49d%2F-M9Vv7iU4HmAAp2uIFPO%2F-M9WL2SLCuHazAXuhoZV%2Fimage.png?alt=media\&token=baf25169-837c-4e5c-a4f7-b13c20a2cf87)

Window manager menu

**Front end look like:**

Popup Mega menu

![](https://3352170884-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MFZzX4YuzXw6bWeNqh8%2F-MFfWVU3sMDI9xXUdxFN%2F-MFfX6AfelXkqfkZDo0_%2Fimage.png?alt=media\&token=295651a4-a136-4baa-8a13-34b8e069be77)