Studio Editor: Managing Dropdowns in a Menu

5 min read
Dropdowns are menu items that function as submenus and containers all in one. You can add items and sub-items to help visitors find exactly what they need, and attach elements to provide a truly custom experience on your client's site.
Before you begin:
Dropdowns can only be added from new menus in the Studio Editor. If you have the previous menu experience, you can create submenus and add mega menus.
In this article, learn more about:

Adding items to a dropdown menu

Add items to create and display a menu in the dropdown. You can add existing menu items, or create new items as you go.

To add menu items to a dropdown:

  1. Select the relevant menu in the Editor.
  2. Click Manage Menu.
  3. (Optional) Add new items to the menu:
    1. Click + Add Item.
    2. Select the item type you want to add and set it up.
    3. Change the item name in the menu.
  4. Click and drag the relevant menu item to move it under the dropdown.
  5. Repeat step 4 for all other items you want to add.
The manage menu panel. An item is being dragged under the Store dropdown.

Adding sub-items to a dropdown

Sub-items are a great way to organize sequential or related content in a dropdown menu, and make it even easier for visitors to find what they need. 
For example, a 'Store' dropdown may contain an item titled 'Shoes'. You can then add 'Boots' and 'Sneakers' as sub-items.

To create sub-menu items in a dropdown:

  1. Select the relevant menu in the Editor.
  2. Click Manage Menu.
  3. (Optional) Add new item to the menu:
    1. Click + Add Item.
    2. Select the item type you want to add and set it up.
    3. Change the item name in the menu.
  4. Move the item into the dropdown.
  5. Drag the item to move it under the relevant 'parent' item in the dropdown.
  6. Hover over the sub-item and click the More Actions icon 
  7. Select Move under "Item name".
The manage menu panel. The cursor is clicking for the sneakers item to be moved under the Shoes item.

Managing dropdown menu items

You can always adjust existing items and sub-items in a dropdown menu. Remove irrelevant ones, rename them, or change the order of the content to keep it fresh.  

To manage dropdown menu items:

  1. Select the relevant menu in the Editor.
  2. Click Manage Menu.
  3. Choose what to do next:
The manage menu panel. The more actions menu has been opened on an item, displaying the options.
Good to know:
You can manage the dropdown item itself with the same steps.

Adding elements to a dropdown container

Since dropdowns are containers, you can use them to display a variety of elements. Add images, buttons, and more to create a unique look on your client's site.

To add elements to a dropdown:

  1. Select the relevant menu in the Editor.
  2. Click Manage Menu.
  3. Hover over the dropdown in the panel.
  4. Click Edit to open the dropdown container.
  5. Click Add Elements  on the left side of your editor.
  6. Click and drag the elements you want to add them to the container.
The add elements panel is open. The cursor is clicking an icon button to add it to the dropdown container.
What's next?
Customize every part of the dropdown to complement the site and menu's design.

Did this help?

|