> For the complete documentation index, see [llms.txt](https://story.groupthought.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://story.groupthought.com/story-v2/header/drop-down-navigation.md).

# Drop-down navigation

Shopify allows you to nest menus and menu items in the Online Store Navigation Editor. A drop-down menu can be created easily by nesting menu items under one main top-level menu.&#x20;

![Drop-downs are ideal for easy to find items](/files/-MW-zREqW0Nd0HMh50XI)

## Setup example

To create a drop-down style menu in your navigation, you'll only need two levels; the main top-level menu and then menu-items below.

![](/files/-MW0-LIr6dbrRbc7bFFT)

![](/files/-MW0-QCtMNF4vugumaXu)

Begin using the Navigation editor for the Online Store in your Shopify Admin:

![](/files/-MW-uDCEVt2Wsavd8Pbm)

In this example, we will convert Vineyard into a drop-down menu and move Contact Us, Our Family, Our History and Our Vineyard as children of Vineyard:

![](/files/-MW01z6bIKtlq66A_RTT)

> Tip: If you have another nested menu like "Wines", open or expand them to simplify the drag-and-drop process.

Use drag-and-drop to move menu items under the parent, Vineyard:

![](/files/-MW044ZsI5wAaiHKTdMd)

If you have at least one nested menu item, creating additional menu items are simple, use the "Add menu to Vineyard" option as shown in the above example.&#x20;

Example of Vineyard with child menu items including the extra "Additional Menu" manually created at the end:

![](/files/-MW04mJC85Wnjs0NmTei)

{% hint style="success" %}
To learn more about how nesting is done in the Online Store Navigation Editor, follow Shopify's support articles: \
\
<https://help.shopify.com/en/manual/online-store/legacy/menus-and-links>
{% endhint %}
