Menus

Overview

Navigation menus help visitors find their way around your website. GritCMS lets you create menus for different areas of your site, such as the header (top navigation) and footer (bottom navigation). You manage menus from Website > Menus in the admin dashboard.

Menu Locations

GritCMS supports two menu locations:

Each location can have one menu assigned to it. When you create a menu, you select which location it belongs to.

Creating a Menu

1. Navigate to Website > Menus in the admin sidebar.
2. Click New Menu.
3. Enter a name for the menu (e.g., "Main Navigation" or "Footer Links").
4. Select the location (Header or Footer).
5. Click Save to create the menu.

After creating the menu, you can start adding items to it.

Adding Menu Items

Menu items are the individual links that appear in your navigation. Each item has the following fields:

Steps to Add an Item

1. Open the menu you want to edit.
2. Click Add Item.
3. Enter the Label, URL, and Sort Order.
4. Click Save.

Repeat this process for each link you want in the menu.

Choosing URLs for Menu Items

Here are common patterns for menu item URLs:

Use relative paths (starting with /) for internal pages. Use full URLs (starting with https://) for external sites.

Nested Menu Items

GritCMS supports nested menu items, which let you create dropdown submenus. This is useful when you have related pages that should be grouped together under a parent item.

For example, a "Resources" parent item might contain:

• Blog
• Tutorials
• FAQ

How Nesting Works

Nested items are configured through the menu item's parent assignment. When adding or editing a menu item, you can set it as a child of an existing item. Child items appear in a dropdown when a visitor hovers over or clicks the parent item.

Tips for Nested Menus

• Keep dropdown menus short. Two to five child items works well. Long dropdowns are hard to navigate.
• Only go one level deep. Deeply nested menus (dropdowns within dropdowns) are difficult for visitors to use, especially on mobile devices.
• Make the parent item clickable too, so visitors who click it (instead of hovering) still reach a useful page.

Managing Menus

Editing a Menu

1. Go to Website > Menus and click on the menu you want to edit.
2. Modify the menu name, location, or items as needed.
3. Click Save to apply your changes.

Reordering Items

To change the order of menu items, update the Sort Order number on each item. Items with lower numbers appear first (left-most in the header, top-most in the footer).

For example:

Deleting Menu Items

To remove an item from a menu, open the menu for editing, find the item you want to remove, and click the delete button next to it. The item will be removed immediately. This does not delete the page the item linked to -- only the menu link is removed.

Deleting a Menu

If you need to remove an entire menu, open it and click the Delete button. The navigation area (header or footer) will be empty until you create and assign a new menu.

Best Practices

• Keep header menus concise. Five to seven items is ideal for top navigation. Too many links overwhelm visitors.
• Put important pages first. Visitors pay most attention to the first and last items in a navigation bar.
• Use clear labels. "Blog" is better than "Our Thoughts and Ideas". Keep labels to one or two words.
• Test on mobile. Check that your menu looks good and works well on smaller screens.
• Use the footer for secondary links. Legal pages (Terms, Privacy Policy), social links, and support pages work well in the footer.
• Update menus when you add new pages. A new page is only discoverable if visitors can reach it through navigation or links in your content.