Create and Managing Website Menus
Usually, website menus are fairly static. They appear at the top (and sometimes bottom) of a web page and typically identical menus appears on all pages. There’s good reason for this – users should know where to find what they’re looking for on your site. However, sometimes to increase user journey clarity, it helps to adjust menus on different pages and use them dynamically in various website elements. In this tutorial we are going to explain what a menu is and how-to setup multiple menus.
NOTE: This is a continuation of our tutorial series on customizing navigation and sidebars on your website. We previously covered creating Panels, which allows you to define different structures for different pages and Widgets, which offers predefined elelemnts to add to your pages.
What is a Menu
A menu is a set of links typically found in your header and footer to highlight your most important pages and help a user navigate your website. On pages with longer form content, like an insight or research piece, you could have navigation links in the side columns of the page to link to similar content.
Menu Placement
On the Lunteer platform menus are placed within Panels. Panels are different layouts for the outer sections of your website, header, footer, and sidebars. On most websites, panels are set and cannot be edited or changed. With Lunteer, you can create panels that fit you content types best. Find out more about Panels here.
Navigate to Menu Page
To navigate to menu options, via the left-hand column, go to Appearance –> Menus
There, you’ll find two options: Edit Menus and Manage Locations
Create/Edit a Menu
Give your menu a Name and click Create Menu
The menu page has 3 major sections
- Select Menu or Create a New Menu – Select the menu you want to edit or create a new menu
- Menu Structure – This is where you see the links and settings for the selected menu
- Add Menu Items – This is the dropdown area where you can select elements to add to a menu
Select Menu
In the menu selector, a dropdown allows you to select the menu you would like to edit, or click the Create a New Menu option to the right.
In the dropdown, you will see the name of the menu and in which panels it is selected to appear (see our documentation of panels):
Menu Structure & Editing Menu
The menu structure of the page is where you see which pages are linked through the menu. You can drag and drop the items to change the order or create submenu options. Remember to always click the Save Menu button on the right top/bottom after you makes changes.
Editing Individual Links
If you want to edit an individual link, click on the arrow on the right of that link. You can edit the Navigation Label of the link, click to move it up or down on the list, or remove the link from the menu.
Menu Settings
Besides building a list of links, there are additional optional settings for menus:
Auto Add Pages – When selected, the menu will be automatically updated when you create a new Parent Page on your site.
NOTE: A parent page is a regular page that is not a subpage.
Display Location – Choose where you menu will display from a list of all the display location options. You can check the corresponding checkboxes to add the menu to each Panel.
Add Menu Items
The Add Menu Items section lists all the elements of your site – choose which ones you would like to appear in the menu. Choose from Pages, Posts, Sliders, Campaigns, Categories, and Custom Links.
Check the pages you would like to add to the menu and click Add to Menu. Or, choose Select All to select all of the items in the section.
Custom Links
You can add a custom link to your menu to link to an external 3rd party website. Enter the URL you want to link to, add the text you want to appear for that link, and click Add to Menu.
NOTE: To create a header menu item as a placeholder for subitems, create a custom link with a dummy URL and Link Text, add it to the menu, and then go back and remove the dummy URL. You will be left with a blank menu item that will allow subitems to be nestled beneath it.
Manage Locations
The Manage Location tab is where you can quickly add a menu to a Panel without opening individual menus. Select your desired menu from a dropdown list and click Save Changes at the bottom.
NOTE: If you are editing a menu you can add the menu to a Panel in the Menu Settings –> Display Location as covered above.
Conclusion
We’re redefining the functionality of menus. Not just for your header or footer, add a menu to any part of your site and customize it to fit the needs of each page to improve your users’ overall site experience.