Note: While our most popular guides have been translated into Spanish, some guides are only available in English.

Adding drop-down menus to your navigation with folders

Use folders to create drop-down navigation menus (also known as nested pages or sub-menus) on your site.

Watch a video

Add a folder

To add a folder:

  1. In the Home menu, click Pages, then click the + icon.
  2. Click Folder.
  3. The empty folder will appear in the pages panel. Enter a name for the folder to display in the navigation.

Add pages to the folder

Folders aren't pages and it's not possible to add content directly to them. Instead, when you add pages to a folder, they appear as drop-down menu items.

To add an existing page to the folder, drag and drop it into the space below the folder. To add a new page to the folder, click Add Page below the folder. To change the order of the pages, drag and drop them within the folder.

It's not possible to nest folders within folders.

Drag existing pages into the space below the folder.

Folder URL

If you navigate directly to a folder's URL, it redirects to the first page in the folder. If the folder doesn't have any pages, you'll see "This folder does not contain any pages." It's not possible to change this text or add other content.

Index pages (version 7.0)

You can add any type of page to a folder except an index page. To direct visitors to an index page, choose Link, click Click to add URL, and use the Content tab to point the link to your index page. For more information about configuring links, visit Adding links to your site.

Folder display

How your folder displays depends on your site's version.

On version 7.1 sites:

  • The folder's pages appear when you hover over the folder name.
  • Clicking the folder title doesn't open the first page.
  • The folder is collapsed on mobile and opens when tapped.

For version 7.0-specific information, see Folder display by template.

Background color

On version 7.1 sites, the folder background matches the Section Background tweak in the Sitewide section of your header's color theme.

To change this:

  1. While editing a page, open site styles, then click Colors.
  2. Hover over the color theme your site header uses and click the pencil icon.
  3. Change the Section Background. This changes the background color for all sections that use this theme.
  4. Hover over Done and click Save.

For a list of the version 7.0 tweaks that set this color, see Folder display by template.

Delete the folder

If you delete a folder, its pages will also be deleted.

To delete a folder:

  1. Hover over the folder in the pages panel and click the trash can icon
  2. Click Delete to confirm. 
  1. Tap the Pages icon.
  2. Swipe left on the title of the folder you want to delete.
  3. Tap Delete.
Tip: You can restore the pages within 30 days.

Product category nested menus (version 7.1)

Product categories create a separate navigation at the top of your store.

On store pages in version 7.1, you can create nested subcategory menus. To learn more, visit Organizing products.

Store pages in version 7.0 have a category navigation, but it's not possible to display nested subcategories.

Was this article helpful?
249 out of 591 found this helpful
Adding drop-down menus to your navigation with folders