Menus are perhaps the core of a Joomla site. In a static HTML site, they merely serve as navigation. In a Joomla site, they serve that purpose but also determine the layout of what a dynamic page will look like and what content will appear on that page when you navigate to it.

The relationship between menus, menu items, pages, and modules is perhaps one of the most confusing in Joomla. This post explains this relationship so that you can create a navigation scheme that works for your site.

In This post

This post examines how the navigation (menus and links) is built for a Joomla website and how the different aspects interact to produce a coherent navigation structure. We look at each of the follow questions.

1. How do menus and modules work together?
2. What do menu items do?
3. What is a blog layout?
4. What is a standard layout?
5. How can I change a menu's appearance through the Module Manager?
6. How do I get submenus or drop-down menus

How Do Menus and Modules Work Together?

Each menu has a module that controls where and how the menu appears on a page. There are currently six menus that are installed in a default Joomla installation. If we go to the Menu Manager, we can see these six, as shown in Figure 5.1. One quick thing to point out in the Menu Manager is that you edit the menu by clicking the small menu item icon, not the title, as you might think.

The six menus are as follows:

1. Main menu. Contains the main navigation for the default content.
2. User menu. A special menu that contains some functions for users when they are logged in.
3. Top menu. A duplication of some links that are in the main menu.
4. Other menu. Contains four offsite links to sites related to Joomla.
5. Example Pages. Links demonstrating the different layouts.
6. Key Concepts. Links to pages explaining layouts and extensions.

The first thing to understand is that each menu has at least one module associated with it. This module controls where and how the menu appears. For example, you could have a module that only appears on the home page and in the left column.

Flip to post 1, "Content Management Systems and an Introduction to Joomla," and read over the part about how a Content Management System is dynamic. The content gets pulled from the database and put into "placeholders" or "buckets" on the pages. A way to understand the previous paragraph is that the menu is the content in the database, and the module is a placeholder for it. If you want to position the menu, you move around its placeholder (the module) from the left-hand to the right-hand column for example. If you want to manage the content of the menu (the links), then you go to the Menu Manager.

The appearance of a menu is managed through the Module Manager, for example, whether a link gets an underline when you hover, what color the link is, and whether it looks like a button. All of these characteristics would be defined in the template's Cascading Style Sheets (CSS) file (more on that in post 9, "Creating a Pure CSS Template") and are controlled in the Module Manager by using a module suffix (also explained further in post 11, "Creating a Restaurant Site with Joomla").

Figure 5.2 shows one of the default menus installed, the mainmenu. Shown is the menu in the Menu Manager, its corresponding module in the Module Manager, and how it is presented in the frontend.

The basic building blocks of these menus are the menu items. Each menu item corresponds to a single link in the frontend. Next we look at the importance of these menu items and what they do.