# Design mega-menu submenu

Enhance your Shopify store's navigation by creating a visually appealing mega menu submenu using the Globo Mega Menu app. Follow these steps to design a customized submenu that improves user experience and showcases your products effectively.

### 🧭 Step 1: Add a Submenu to a Main Menu Item

1. Open the **Globo Mega Menu** app in your Shopify admin panel.
2. Navigate to the main menu where you want to add a submenu.
3. Click on the desired main menu item.
4. Click the **"Add Submenu"** button.

<figure><img src="/files/VFnCNP0Li5cRpCdpCTFf" alt=""><figcaption></figcaption></figure>

### 🧩 Step 2: Choose a Mega Menu Template

1. A popup window will appear.
2. Select the **"Mega menu"** tab.
3. Choose a pre-built template that suits your design preferences, or select **"Blank"** to create a new template from scratch.

<figure><img src="/files/KSaKZDxuRZCd95UJi89v" alt=""><figcaption></figcaption></figure>

### 🛠️ Step 3: Customize blocks

1. If you selected the **"Blank"** template, click the **"Add block"** button.<br>

   <figure><img src="/files/e6WxrGfSd5MxpJAd7XzP" alt=""><figcaption></figcaption></figure>
2. Choose the type of block you want to add, such as:
   * **Products**
   * **Collections**
   * **Images**
   * **Custom HTML**
   * **Contact Forms**
3. Adjust the width of each block to organize your layout:
   * The row's width is divided into 12 units.
   * <mark style="color:red;">For example, to have three equal columns, set each block's width to</mark> <mark style="color:red;"></mark><mark style="color:red;">**4**</mark> <mark style="color:red;"></mark><mark style="color:red;">(since 12 ÷ 3 = 4).</mark>
   * You can mix and match widths to create varied layouts.

<figure><img src="/files/UXn3clCQtoKmyXJW2rXx" alt=""><figcaption></figcaption></figure>

### 🧠 Tips for Effective Mega Menu Design

* **Consistency**: Maintain a consistent design across all menu items for a cohesive look.
* **Visual Hierarchy**: Use varying block sizes and types to highlight important items.
* **Responsive Design**: Ensure your mega menu looks good on all devices by previewing changes on both desktop and mobile views.
* **User Experience**: Organize items logically to help users find what they're looking for quickly.

### ✅ Final Result

By following these steps, you'll create a customized mega menu submenu that enhances your store's navigation and provides a better shopping experience for your customers.

**💬 Need help?**

Email us at **📧 <hi@globosoftware.net>** - we’re happy to assist!


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.globo.io/mega-menu/manage-menu-items/manage-submenu-items/design-mega-menu-submenu.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.