> For the complete documentation index, see [llms.txt](https://beloria-docs.boostheme.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://beloria-docs.boostheme.com/static-sections/powerful-mobile-megamenu-section.md).

# Powerful Mobile Megamenu

{% hint style="info" %}
This guide only matches with version tf-4.0 or newer. If you want are using version tf-3.5 or older, please refer to [the old guide](/static-sections/powerful-mobile-megamenu-section/old-powerful-mobile-megamenu-section.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/-MRecQ-MDY4izm5U4_qs)

{% 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/-MRhgkR0G0gzH9QNk8t4)

## 2. Global font size settings

![](/files/-MReppxitUfkJo1qbyS4)

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/-MRegvFXdj8DcGeTFH2A)

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/-MRejtkq9FkEfyR9gh4S)

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

#### 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-link-list-shopify-navigation) 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/-MgxRj_NDlfgaDxtk8AW)

#### 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-link-list-shopify-navigation).
  * **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.
