# Menus

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-48169d430cd7b3ab4682c44f87b5052e68b3f555%2Fimage%20(303).png?alt=media" alt=""><figcaption></figcaption></figure>

Going into the Menus tab, you can customize them as follows

## 1. Side navigation menu

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-6430c63ad826bc458f84d6646456e0100a8eb319%2Fimage%20(304).png?alt=media" alt=""><figcaption><p>Standard menu links</p></figcaption></figure>

By default, we offer 4 standard links necessary for customers to navigate through the app (as referenced in the above picture). You have the option to:

* Add a new menu item (up to 10)
* Edit a menu item
* Hide a menu item
* Rearrange the menu items
* Remove a menu item

### Add a menu item

Click on **Add menu item**. You will see a new section added to the list for configuration.

{% columns %}
{% column %}

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-a0dab54bb57f15568a72f9246031989b20c8fb70%2Fimage%20(305).png?alt=media" alt=""><figcaption></figcaption></figure>
{% endcolumn %}

{% column %}

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-7773a0b50c3701d91f904f3a0835a35eb3172e57%2Fimage%20(306).png?alt=media" alt=""><figcaption></figcaption></figure>
{% endcolumn %}
{% endcolumns %}

### Edit a menu item

<div data-full-width="false"><figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-1636e23cfc8f99f0475749355e4e2ad05cf8dbc9%2Fimage%20(307).png?alt=media" alt=""><figcaption></figcaption></figure></div>

After adding a menu item, you can configure it as follows:

* Input **Title** for the menu link. Then, select or upload an icon for it.

  <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-4985a40a35180467428a27cf7917d921588dac03%2Fimage%20(308).png?alt=media" alt=""><figcaption></figcaption></figure>
* Choose a link to open a page upon pressing it. You can direct users to:
  * **Collection listing page**, where you typically list all the collections

    <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-b608e5f2096627e46ff78eba081d0b60fafd0327%2Fimage%20(312).png?alt=media" alt=""><figcaption></figcaption></figure>
  * **Product page** of a product you choose to feature

    <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-5eca0f4a92f0656e588248d8b910fb48ad6d353e%2Fimage%20(310).png?alt=media" alt=""><figcaption></figcaption></figure>
  * **Product listing page** of a collection you choose to feature

    <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-fde334e7da7ef1c18be929e842a24761638e3d69%2Fimage%20(313).png?alt=media" alt=""><figcaption></figcaption></figure>
  * A **website link**. By default, users can open a webpage wrapped inside your mobile app without being directed to the browser, reducing friction in the user experience.

    <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-58429ceee6747268c8e9d170814586fa8fe5d007%2Fimage%20(314).png?alt=media" alt=""><figcaption></figcaption></figure>
  * The **profile** **page**, where users can sign in and manage their accounts in the mobile app

    <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-c31c13c2358d21fc9ad074c501888993944358a3%2Fimage%20(316).png?alt=media" alt=""><figcaption></figcaption></figure>
  * The **order history page**, where users can keep track of their orders

    <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-c6f7a006bcc1d6ba8fcf5b3c931fc8ded64409e2%2Fimage%20(317).png?alt=media" alt=""><figcaption></figcaption></figure>
  * Or, you can choose to have **no link**, which is usually for an upcoming page you want to communicate with users.

### Hide a menu item

Hover over a menu item and click on the **eye icon** to hide it; click on it again to unhide.

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-2491950049f8db45b77391ed01aef4cd5f311da8%2Fimage%20(318).png?alt=media" alt=""><figcaption></figcaption></figure>

### Rearrange the menu items

Click on a menu item, hold the mouse, and drag it up or down to position it where you want.

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-56b2abf06d5da34a358cb08b680a8a10fa275dd3%2Fimage%20(319).png?alt=media" alt=""><figcaption></figcaption></figure>

### Remove a menu item

Hover over a menu item and click on the **trash bin icon** to remove it, then click **Discard** to confirm the action.

<div><figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-f9741095403d30bfd7521dd6d985bc38e145b2bb%2Fimage%20(320).png?alt=media" alt=""><figcaption></figcaption></figure> <figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-90addfe43b9e8825f96addabeffe66aa83523cce%2Fimage%20(321).png?alt=media" alt=""><figcaption></figcaption></figure></div>

## 2. Bottom menu bar

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-a47715231720f3e277de65c9ef3825504c642085%2Fimage%20(322).png?alt=media" alt=""><figcaption></figcaption></figure>

By default, we provide 5 common pages, in which Home is always placed first, and Account is always required. You have the option to:

* Add a menu item (up to 5)
* Edit a menu item
* Hide a menu item
* Rearrange the menu items
* Remove a menu item

### Add a new menu item

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-eab7de8cf5342635fa5fa45ed896133a71368e0e%2Fimage%20(323).png?alt=media" alt=""><figcaption></figcaption></figure>

The menu items that are not mandatory and thus can be added include:

* Category
* Cart
* Wishlist

To add a new item, click on **All menu item** and choose the item you want to display.

### Edit a menu item

You can edit the title and change the icon of the menu item from a list or by uploading an image. **Note** that the title can only contain **no more than 10 characters**.

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-ff0f0b601e4823c239b89fad123290cca510184a%2Fimage%20(325).png?alt=media" alt=""><figcaption></figcaption></figure>

### Hide a menu item

Hover over a menu item and click on the **eye icon** to hide/unhide it.

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-dc9ac9308ac744ce0d6ef56ffb2338ae047008f6%2Fimage%20(326).png?alt=media" alt=""><figcaption></figcaption></figure>

### Rearrange the menu item

Click on a menu item, hold the mouse, and drag it up or down to position it where you want.

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-d84114423cc22ae7ba3e8f2dc2434c680790db23%2Fimage%20(327).png?alt=media" alt=""><figcaption></figcaption></figure>

### Remove a menu item

In case you don't want to complicate the bottom bar menu, you can choose to remove these items by hovering over them and clicking on the **trash bin** icon:

* Category
* Cart
* Wishlist

<figure><img src="https://4116947012-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZvOReVnJPMF91ppETQNN%2Fuploads%2Fgit-blob-135755f203ce8fbf575ee20e8b17f7ec9fc81fd9%2Fimage%20(329).png?alt=media" alt=""><figcaption></figcaption></figure>
