Create powerful Shopify mega menus

Step 1: Enable App

Embed Mega Menu into Your Theme

Go to your Shopify Admin. From the left sidebar, navigate to Online Store → Themes. Find your current theme and click Edit theme.

In the theme editor, open the App embeds section. Locate Hukify – Mega Menu Pro and toggle it ON. Click Save to apply the changes.

Please go to the Settings page to enable the app

---

Step 2: Create Group Menu

Create a new group menu with status set to Active.

---

Step 3: Click Button Menu

After creating a new group, click the menu button.

Here, you can design a new menu.

---

Step 4: Create new menu

Click the 'Add New Menu' button.

Then select a template to display the menu.

You can use a built-in template or create your own custom menu template.

Then, select the 'Add & Design' tab.

---

Step 5: Configure the position of the menu to display on the frontend.

Go to the 'Add & Design' tab and choose the position for the menu to appear on the frontend.

There are two locations to display the menu outside the frontend: one for desktop and one for mobile.

---

Step 6: Select a theme for the menu to display on the frontend.

Choose the theme to display the menu.

If you'd like to add all themes or menus to public themes, please choose the two options above.

You can also specify a CSS selector to add the menu to an element.

---

Step 7: Save Menu

Click the 'Save Menu' button.

NOTE: Please clear your browser history before checking the menu on the frontend.

---

Video Tutorial: How to Show Mega Menu on Your Store

Watch the video below for a step-by-step walkthrough of how to create, configure, and display the Mega Menu on your Shopify store.

Enable lazy loading for images.

---

Change the submenu display effect.

---

Change the trigger effect for displaying the submenu.

---

Use the AJAX cart with the Mega Menu.

You must install the AJAX Cart Pro app before using this feature.

---

Change the submenu background.

---

Change the text color of the submenu.

---

Change the hover text color of the submenu.

---

Change the underline color of heading items.

---

Change the product price color.

---

Change the product name color.

---

Change the font size of the submenu.

---

Change the submenu type.

---

Change the submenu width and position.

---

Change the submenu background image.

---

Change the height of menu items.

---

Change the menu item alignment.

---

Change the menu background.

---

Change the menu text color.

---

Change the active text color of the menu.

---

Change the active background color of the menu.

---

Change the menu font size.

---

Disable link

Disable the link if you don't want to display a link for the menu item.

If you'd like to add a link, there are different types of links to choose from.

---

Add an icon.

Add an icon for the menu item.

---

Add a badge.

If you want to display it on the menu item.

---

Extra class name.

Add a custom class to the menu item.

---

Column width.

Adjust the column width if you want to change it.

---