Web design 1

Organize the vertical menu of your site

A step-by-step guide to using the menu editor to manage your site navigation links in the side menus or website sidebars.

Your website side menus can be used to provide website navigation for your visitors and can also display content directly to complement or highlight the content of your website.


Accessing the menu editors

To begin managing the content of your side menus, head to the Settings > Menus menu of the site manager. Depending on the design theme applied to your website, you'll find either one or two side menus represented in the site manager.

Each side menu can be located to the left or right of the site content zone, and - if the design theme allows their position to be changed - you'll change the actual position of the side menu from the Settings > Design > Personalize menu.

Though the design template applied to your website can have one or two side menus, you can disable one or both from the Settings > Menus menu, by unchecking the Enable box, and saving your changes.

Managing menu content: menu widgets

Each of the elements you'll add to your side menus is called a widget. A list of links to a page category, a link to your website homepage, a site search engine, a map or newsletter subscription form ... they're all different kinds of widgets, and each widget has its own purpose. You'll select the widget to add to your menu according to the type of content you'll want to add to the menu.

  • To organize the widgets in your side menu, drag and drop them into position (to move them up or down the menu), or to move them from one side menu to the other.
  • You can edit an existing side menu widget, delete it, or temporarily hide (mask) it on your website at any time, by clicking the relevant link below each widget's title and description.

Whenever you add, remove or edit widgets in your side menus, or change their positions, don't forget to save your changes by clicking the Save button at the bottom of the menu editing page when you're done.

Adding menu widgets

To add a new widget to your side menu, click the Add a widget button at the top of the relevant side menu. A pop-up window will open, displaying the different types of widgets to choose from.

  • Note that depending on which content add-ons you've enabled for your website, the types of widgets you'll see when adding a widget to your menu may be different to those displayed in the image.

To add links to pages (created in the Pages add-on), first choose the Pages widget category. You can then add a link to a page, or to a page category. If you add a link to a page category, you can also choose whether or not to display a list of links to the pages in the category to your menu.

Choosing menu link list display modes

In this example, we're going to add a page category to the menu, and we'll also configure it to display a list of each of the sub-categories and pages within our page category.

When adding category widgets with lists of links, you can also choose how those lists should be presented on your website.

  • In the example to the rights, we've chosen the Pages widget category, and added a List of items of a category. The page category we've chosen is Nature's wonders, which contains one sub-category (which has one page), and several pages.
  • To display the list of sub-categories, pages and sub-pages (pages contained withing sub-categories of the category we're adding to the menu), we can either choose the List of links to each directly in the menu (1) or display the links as a drop-down menu (2).
  • If we choose the drop-down menu, we'll save space in the menu; visitors will click the drop-down menu to access the links to the pages, sub-categories and sub-pages of the category Nature's wonders.

Configuring menu link lists

Each time you add a list of links, you'll choose whether to display sub-categories (linked categories - 1) in the list. If you display them, you can add an optional page count (2) to the right of the category in the list: it will display the number of pages within the sub-category.

As sub-categories can also contain their own pages, you can choose whether or not to a display a sub-menu of the pages of each sub-category within a parent category; the sub-menu will be displayed when moving the mouse pointer over the sub-category's title in the menu (3).

You'll also choose whether or not to display a link to each of the pages in the parent category (4).

Accordion menus

If you'd prefer to keep your menu's short, whilst still adding links to all your site content, you can enable the accordion menu mode. Accordion menus open and close when clicking on the title of the menu widget.

  • In the example to the right, we've enabled the accordion menu mode. To enable accordion menus, you'll need to head to the Settings > Design > Personalize menu of the site manager. Note that not all design themes incorporate accordion menus.

Once enabled, menu widgets will be closed on your website (1), and will open to reveal the list of links only when clicking on the title of the menu widget (2).

As the title can only "react" in a single way to a click, if you've defined a link for the title text for any of the menu widgets, the accordion effect will not be enabled for these widgets. To enable it, edit the menu widget to remove the title link address (URL).

Working with side menus

Managing side menu content is simple, but if you'd prefer not to manage your side menus, you can simply check the appropriate boxes each time you add a new category to an add-on, or enable a new add-on. When doing so, you'll be presented with a list of options enabling you to add appropriate links to your side menus. Just check the relevant boxes, and save your changes.