How to Add A Sub-Menu

Knowledgebase Article

How to Add A Sub-Menu

This tutorial explains how to make a 'sub-menu' in ProSite. A sub-menu will appear as a drop down menu in your menu bar, as a child menu item of a parent page. You may wish to use a drop down menu where you have a large number of pages which would result in a very long navigational structure, such as follows:

To create a sub menu:-

1. Launch the Site Builder tool from your cPanel.

2. Click on your website menu and then in the section beneath this click on Edit Menu.

3. If you have not yet created the page that you'd like to insert as a sub-menu item, click on New Menu Item. You will have the opportunity to clone contents from another page or you can selectively copy certain sections.

If you have already created your pages, you may see these in your list of menu items:

4. To make the new menu a sub-menu, you need to drag and drop it to the main menu. In my example, I drag and drop the 'Project A, B and C' menu items on 'Projects' menu item. The menu should become indented, indicating that this page is now a 'sub-menu' item.

5. Click on 'Apply' button.

The menu items will now be removed from the top level of navigation:

6. You won't be able to trigger the drop down menu in the editor itself. To see how the menu looks, press the Preview button.

In the preview mode, you should now see the drop down menu appear.

If the styling doesn't look right, you may need to adjust the styling of the sub-menu item. It is possible your menu hasn't yet been configured to operate as a sub-menu.

7. Close the Preview and click on your Menu again. In the right side, locate the Menu styling options and select the Submenu tab.

In the example above, there is no background colour to the sub-menu. In this case you can specify a background by selecting the Edit icon next to Background in the Submenu tab, and then select your preferred colour.