May 11, 2017
Depending on your theme, you may have multiple menus in different areas of your pages/posts. Pages can also have different menus. Posts inherit their menus and sidebars from the page set to display “posts.”
We’ll cover how to make and structure menus in WordPress, and then discuss the specifics of where the menus may appear in your particular theme, and how to format them, as well as a few additional classes that can be added to modify your menus.
General Guidelines for Menus
4-7 Top-Level Items
Menus are meant to help users find things easily, they look through a list of items and click the one closest to what they are looking for. The catch is that the average person can only hold 4-7 items in their short-term memory, so your menu should be the same size. If your menu has more than 7 top-level items, users will forget what their options are by time they reach the end, which leaves them feeling frustrated and annoyed. Keeping your menus simple will keep your users happy.
Simplify Menu Titles
Avoid long titles for menu items. Users are scanning your menus for key-terms, so give them what they’re looking for. For instance you make have a page titled, ” Spring 2017 Web Team Meeting Schedule,” but a better menu label might be “Web Team Meetings” or “Web Team Schedule.”
More Small Menus is Better than Less Big Menus
Use Hierarchy to Show Relationships
If pages have parent-child relationships, use them to structure your menu. You can “nest” a child item inside a parent item by dragging it to the right. This helps users understand how your site is structured.
Creating & Editing a WordPress Menu
Choosing a Menu
You can create and edit menus through the “Menu” screen, which is access by hovering over “Appearances” in the WordPress dashboard and then clicking “Menus.” If your site already has menus created, it will pull up the last one saved for editing. If you would like to create a new menu, click “create a new menu”; if you would like edit an existing menu, use the drop-down to select the one you wish to edit and click “Select.”
Adding Items to the Menu
To the left of the Menu screen, you will see a series of drop-downs. These allow you to add pages, posts, categories or custom URLs to your menu. To add a post or page, click the checkbox next to the item(s) you wish to add and click “Add to Menu.” They will now appear at the bottom of the menu on your screen.
Reposition Items in the Menu
If you want to change the order of menu items, first click the menu item you want to move. Then drag it to its new location. Click “Save” to save your changes.
DSU Theme-specific Menu Locations
On most themes, the base Dixie-S15, the Dixie-S15 plus Posts, and the Dixie-S15 Blog only have sidebar menus. They require no special formatting, and check “Main Menu” and “Mobile Menu” for whichever menu you wish to appear on mobile screens. The Dixie-S15-schools theme & the Dixie-S15-portal theme both have special use cases.
In addition to the standard sidebar menu, this theme allows for a custom top menu. It requires very specific menu formatting to to work correctly, so you may want to ask the Web Team or your Web Intern to assist you with this. View the images below to learn how these menus are generated.
In addition to the standard sidebar menus, this theme uses WordPress menus to generate the content for several sections of the front page. Neither of these menus require special structure, but do have some rules. The Quick Links menu should contain 3-5 items total, with no nesting. The Resources menu can have as menu items as you wish, and can have one level of nesting. By default, the Resources menu will divide up the links into three columns. If you have a list you do not want broken up, add the class “break” to the parent item and save. The list should no longer break. You can choose which menu you would like to be the “Quick Links” or “Resources” menu by checking the box that appears when the Dixie-S15-Portal Theme is activated.