You create a dropdown menu (submenu) in Loopia Sitebuilder by dragging a navigation item onto another item in Navigation settings. Dropdown menus are useful for large sites with complex page hierarchies – showing a list of related links under a menu item in your header navigation makes it easier for visitors to find the right page.
Note: submenus are created in Navigation settings, where you can only work with existing pages. Create the pages you want to organise in the menu before you build the dropdown.
Creating a dropdown menu
- Click Navigation in the top bar to open Navigation settings with the list of your navigation items.
- Click the item’s hamburger icon and drag it onto the parent page’s name.
- Click Submit to save, and publish your site to see the changes online.
The result is a navigation item attached to the parent item, creating a two-level hierarchy.
Tip: you can add as many page items as you like to a dropdown menu, but keeping it short helps avoid confusing visitors.
You can add a further level by repeating step 2: in Navigation settings, drag the page item you want in the third-level submenu and drop it inside its parent element. You can create up to three levels of dropdown menu.
Tip: to keep every menu item visible on screen, move the expandable menu link closer to the middle of the navigation bar. If it’s too close to the edge of the page, the dropdown items can overlap other elements on your site.
Removing page items from a dropdown menu
To remove an item from the dropdown menu completely, click the bin button next to its name.
Or you can change the item’s level in the submenu by dragging and dropping it between higher-level items:
- In Navigation settings, click the hamburger icon of the item you want to move and drag it into the list of higher-level items.
- When a line appears between the higher-level elements, drop the item at the highlighted position.
- Click Submit to save.
Note: if you move every item to the main menu and the design doesn’t have room for them all, they’re moved automatically to the More submenu.