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

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

Note: Nested folders (folders within folders) aren't supported at this time.

Watch a video

Add a folder

  1. Home Menu, click Pages, then click the icon.

  1. Select Folder from the New Page menu.

  1. The folder will appear in the Pages panel with a blank field. Enter a name for the folder here. This is the text that displays in the navigation.

Add pages to the folder

Pages you add to the folder 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 the + icon below the folder.
  • To change the order of the pages, drag and drop them within the folder.
Note: Index Pages can't be added to folders.

Folder display

See how your folder appears on your site by clicking the hide arrow to enter a full preview. Each template displays folders differently.

In templates with vertical navigation menus, the folder appears as a drop-down menu when you click or hover over the folder title. On touchscreen devices, they display when tapped.

In most templates, clicking or hovering on a folder title opens the drop-down menu. It doesn't open the first page in the folder. The templates below are the exception:

In these templates only, clicking the folder title opens the first page in the folder. Templates are grouped by family.

  • Bedford, Anya, Bryant, Hayden
  • Brine, Aria, Basil, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Jaunt, Juke, Keene, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Polaris, Rally, Rover, Sofia, Sonny, Sonora, Thorne, Wav, West
  • Farro, Haute
  • Flatiron
  • Pacific, Charlotte, Fulton, Horizon, Naomi

Folder navigation

Some templates have notable folder styles that add an extra layer of navigation:

Sidebar navigation

In Bedford, Anya, Bryant, Hayden, pages in a folder appear in a menu on the left sidebar of the page.

Header navigation

In Adirondack, pages in a folder appear in a menu between the Main Navigation and page content.

Folder Header Navigation displays on mobile devices only when mobile styles are disabled.

Footer columns

In these templates, if you choose Layout: Columns in the Style Editor, each folder’s name appears as a header with the folder’s page links below:

Background color

Many templates display a background color behind the folder drop-downs links. In most templates, this color matches another element on your site, such as the header background or site background. 

Use the list below to find the style tweak for the folder background color on your template. Keep in mind that these tweaks may adjust other elements on your site. For more information, visit your template's Structure and style guide.

  • Adirondack - Background Color in the Site Header section
  • Avenue - Site Background
  • Aviator, Aubrey, Encore - Folder Dropdown Background
  • Bedford, Anya, Bryant, Hayden - Header folders: Header Background Color. Footer folders: Footer Background
  • Brine, Aria, Basil, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Jaunt, Juke, Keene, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Polaris, Rally, Rover, Sofia, Sonny, Sonora, Thorne, Wav, West - Header folders: Folder Color. Footer folders: Background Color in the Footer section.
  • Farro, Haute - Header folders: Folder Color. Footer folders: Background Color
  • Five - Navigation Background
  • Flatiron - Header/Footer Background Color
  • Forte - Auto-selects the color based on background color or image
  • Galapagos - Header folders: Background Color. Folder links follow Nav Link Color. Footer folders: Nav Link Color. Folder links follow Background Color
  • Ishimoto - Site Background
  • Marquee, Adversary, Alex, Eamon, Ginger, Mint, Shift (discontinued) - Header folders: Background Color. Footer folders: Footer Background Color
  • Momentum - Navigation Background
  • Montauk, Julia, Kent, Om - Canvas Background
  • Native - Site Background
  • Pacific, Charlotte, Fulton, Horizon, Naomi - Background Color
  • Skye, Foundry, Indigo, Ready, Tudor - Site Background
  • Supply - Header Color
  • Tremont, Camino, Carson, Henson - Transparent
  • Wells - Site Background
  • Wexley - Site Background
  • York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori - Site Background

Delete the folder

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

To delete the folder, hover over it in the Pages panel and click the trash can icon. Then click Delete.

Tip: You can restore the pages within 30 days.
Was this article helpful?
86 out of 176 found this helpful