# Powerful Mobile Megamenu

{% hint style="info" %}
This guide only matches with version 3.0.0 or newer. If you want are using version 2.2.1 or older, please refer to [the old guide](/static-sections/powerful-mobile-megamenu/old-powerful-mobile-megamenu.md).
{% endhint %}

## 1. Open Powerful Mobile Megamenu section

1. From your Shopify admin, go to **Online Store** > **Themes**.
2. Find the theme that you want to edit and click **Customize**.
3. Click the **Powerful Mobile Megamenu** section.

![](/files/-MSLUgnlkUd2ehL8QTDm)

{% hint style="warning" %}
To see the changes in this section, you need to adjust the Theme Editor Preview to the mobile screen. Please refer to the below image.
{% endhint %}

![](/files/-MSLUzjjRQg1foTVsBcL)

## 2. Global font size settings

![](/files/-MSLVXASRAV1WyYLP18r)

Configure font size for Level 1, 2, 3 items, and label.

## 3. Menu item types

Mobile Megamenu is built based on the menu item types. Our theme provides 2 menu item types that will help you build the menu easily. An item is a block. Please refer to [this guide](/manage-blocks-in-a-section.md) for managing blocks in a section.

### 3.1. Top items by link list

![](/files/-MSLWlw2u3lEt9elo3Dh)

This is a level item type. This item type will help you display a hierarchy of menu items quickly. This is a special item, it's not a parent, also a child item. An item of this type can render lots of level 1 menu items.

#### GENERAL SETTINGS

* **Pick a Shopify Navigation:** pick a Shopify Navigation ( Link list ) to display top and child items.
* **Children style:** specify a style to display child items.

![Style 1](/files/-MSLXljVEFBpYBmdedJN)

![Style 2](/files/-MSLXsyEVrQZVqnvtnvj)

#### LAYOUT SETTINGS

* **Show the link list in 2 Columns:** display child items in 2 columns. Only work on children's style 1.

#### COLORS

* **Level 1:** configure color for level 1 items.
* **Level 2:** configure color for level 2 items.
* **Level 3:** configure color for level 3 items.
* **Label text color:** configure color for the text in a label.
* **Label background color:** configure the background color for a label.

### 3.2. Menu item

#### GENERAL SETTINGS

* **Item title:** the menu item title that will be shown at the storefront. You can refer to [this guide](/tips.md#add-a-label-icon-to-a-text) to add a label, icon to the title. The title will be displayed as a level 1 menu item.
* **Title URL:** add a link to the menu item.

#### COLORS

* **Level 1:** configure color for level 1 items.
* **Level 2:** configure color for level 2 items.
* **Level 3:** configure color for level 3 items.
* **Label text color:** configure color for the text in a label.
* **Label background color:** configure the background color for a label.

![](/files/-MflQFQ4ZsHL34nrhnGC)

#### FOR DEVELOPER

Add your custom HTML for the item.

#### CHILD ITEM (LEVEL 2 & 3) SETTINGS

This item type offers 5 children items. Below are settings in a child item:

* **Enable:** tick to show the child item.
* **Title:** add the item's title. The title will be shown as a level 2 item.
* **URL:** set the link for the item.
* **Item's width:** adjust the width of the item's content. The item content will be shown as a level 3.
* **Item content ( level 3 ):**
  * **Pick a link list:** choose a link list to display in the item content.
  * **Show the link list in 2 columns:** tick to show the link list in 2 columns.
  * **Label color:** set the color of labels that are shown in the link list. Please refer to [this guide for adding labels in a link list](/tips.md#add-a-label-icon-to-a-text).
  * **Label background color:** set the background color of labels that are shown in the link list.
  * **Image:** pick or upload an image to display in the item content.
  * **The text overlay:** add text to display override the image.
  * **URL:** set the link for the image.
  * **Your text or HTML:** add custom text or HTML to display in the item content.


---

# 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://vodoma-docs.boostheme.com/static-sections/powerful-mobile-megamenu.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.