Overview

A split menu in Joomla! is a design technique where a single menu structure is broken up and displayed across different areas of a webpage. Instead of cramming a massive, multi-level navigation tree into one crowded drop-down menu, a split menu separates the levels.

For example, your primary links (Level 1) sit horizontally in the website header, while the secondary sub-links (Level 2+) dynamically appear in a sidebar or footer on the page that top-level menu link opened.

Why Use a Split Menu?

Using split menus offers significant advantages for both site performance and user experience:

• De-cluttered Design: It eliminates messy, massive drop-down menus that overwhelm mobile visitors and obscure your content.
• Automatic Syncing: You maintain just one menu tree in the site backend. Joomla! handles the logic automatically, so you never have to manage separate menus for headers and sidebars.
• Contextual Navigation: The secondary menu module is smart. It remains invisible until a user clicks a top-level item that actually contains sub-pages, keeping layouts clean.

How Joomla! Processes the Split

The magic of split menus relies on Joomla!'s native Menu Module parameters. By placing two different menu modules on your site but pointing them to the exact same menu container, you control the output using three key settings:

• Start Level: Tells the module which tier of the menu tree to begin rendering.
• End Level: Tells the module where to stop rendering.
• Show Submenu Items: Dictates whether deeper child items should be completely hidden or structurally rendered.

The Setup Logic

To make a split menu work, you simply configure two modules like this:

• The Header Module: Set the Start Level to 1 and the End Level to 1. This restricts the header to showing only your main parent links (e.g., Home, About, Services, Contact).
• The Sidebar Module: Set the Start Level to 2 and the End Level to All. Set the Base Item to Current. This tells the sidebar: "Look at what page the visitor is on, check if it has child items, and display them here."

The End Result

When a user visits your home page, they only see the clean top navigation bar. If they click on Services, the main page loads, and the sidebar instantly populates with Web Design, SEO, and Marketing. It provides a seamless, deep-navigation experience without any complex coding or tedious extensions.