Introduction to menus

Not every webpage needs the same menu, so we’ve made a tool that allows you to easily create different menus for different parts of your site.

The first page in the menus section is accessed via Content > Manage Menus, which will deliver you to the menus index screen where you can see, at a glance, all the menus you currently have available. The name of each menu is listed, along with whether categories are automatically added, if it is the main menu or not, and the number of menu items it has.

Using the index screen you can select one or multiple menus and use the bulk edit menu to delete them, or if you have one selected you can quickly set it to be the main menu:

The second page is the edit page where you can view each menu in more detail and make any changes you need to. This is access by clicking on a menu's name on the index screen:

The layout of your menu is shown to the right, with nested sub-menus being indented and smaller than normal menu items:

How to add a menu

To add a menu, navigate to the Menus area via Content > Manage Menus.

Click on Add Menu.

Enter a Name for your new menu in the Name field:

Add items to your menu by clicking the red '+ Add menu item' button:

This will add an item to the tiled list down the right hand side, highlighted in green:

The centre of the screen will now show you controls for setting where this menu item will link to, and what it will be labelled as:

You can link various aspects of your site, and even custom URLs by using the 'Item type' dropdown:

In this example I am linking a page so I have selected Page, causing a second dropdown to appear, allowing me to select a page that exists on my site already:

Once you have done this you can add an icon if you wish:

And even change the label of the menu item:

I

f you want to make this item a dropdown option below another menu item, use the move controls to position the selected menu tile underneath the menu item you wish it to appear under, and then press 'Move into sub-menu':

Equally if you wish to move a sub-menu out of being a sub-menu item to become a top level menu item, the button will change to say 'Move out of sub-menu'.

If the menu item you are adding is a top level menu item that you wish to add sub items to, click the green 'Add sub-menu item' button:

Once you have finished arranging the menu tiles in the order you want, click Save in the top right corner.

How to edit a menu

When editing a menu it is helpful to have an understanding of what your options are, so we will run through the items on the edit screen in more detail here.

Exploring your options

Name

The name field is where you can set or amend the name of this menu. This name is for your reference only and is never seen by the user.

Automatically Add Categories

The name field is where you can set or amend the name of this menu. This name is for your reference only and is never seen by the user.

Main Menu

The name field is where you can set or amend the name of the menu. This name is for your reference only and is never seen by the user.

New Menu Item

A menu item is essentially a link inside the menu. Click on Add new menu item to add a new link or button to this menu.

Editing a menu item

You will only see this window if you click on the Add new menu item button or select an item from the list to the right.

Item Type

There are three different types of item or link that you can put into each menu.

Dropdown: A standard unlinked dropdown for sub-menus

Brand: Link for any brands you have

Category: link directly to a category. This list of categories is automatically generated by from product categories.

Custom: A custom link

Page: link to a custom page.

Product Group: Link to a Product Group made

Each item type can have an icon at the start of it, simply choose one from the icon dropdown next to the label field.

Moving menu items around

You can change the order of your menus by moving each item up and down by using the movement buttons.

Sub-Menu Items

A sub-menu item is a link that comes under another link and they work the same way as normal menu items. You can move sub-menu items around in the same way that you more normal menu items.

You can add as many sub-menus to a menu item as you want, however you can only go down one level (i.e. you cannot have a menu inside a menu, inside a menu).

Adding your menu into your design using BlockLab

For information on adding your menu into your design via BlockLab, please refer to this guide.

How to delete a menu

To delete a menu, on the menus index screen, tick the boxes of the menus you wish to delete.

You will notice a red dropdown box appear.

Select 'Delete'.