Joomla! 1.5 Native Split Menus
Written by Kenneth Crowder   
Sunday, 11 May 2008 18:35

Joomla! 1.5 has many cool new features that have made our lives easier. In the Joomla! 1.0.x line, if you wanted to have Split Menus, you had to "trick" the system into doing what you wanted by micromanaging Menus and their Menu Items. Some big name template makers had fancy scripts that would mimic this technology in the past.

Let's see it in action!

This first image is an image of the Main Menu once "Features" is selected. You can see that the Sub-Navigation drops out underneath its parent. This is the typical way menus work. Let's now take a look at what the Split Navigation looks like.

As you can see from this image, once the "Features" menu item was clicked, it's Sub-Navigation did not drop down like normal. It shows up on the right side. This is because I told it to show up on the right side. You could have it show anywhere you wish as it is its own module, independent of Main Menu. The only part that ties the two together is that they are pulling data from the same menu.

Let's see how to do this yourself!

  • You will want to start by making sure that you have a menu that has Sub-Navigation items. You can create dummy Sub-Navigation items if you need to.
  • From the Administrator, click on "Extensions" -> "Module Manager".
  • Click on the module for the menu that you want to enact split menus on.
  • In the Parameters area on the right, change "End Level" to "1". "Start Level" should remain as "0". This is going to tell the Menu to only show one level in its menu. Are you catching on yet?
  • The next thing that we need to do is to create another menu module for the menu that we just edited. In my case, it was Main Menu. I called my new menu "Sub Menu".
  • In the Parameters area on the right, change "Start Level" to "1" and "End Level" to the max depth that you think your menu will ever be. I chose 5, but you can choose a higher number if you wish.
  • For my example, I changed the module "Position" to "right" and I set "Show Title" to "No". Note: If you have you’re your title set to show and there are not Sub-Navigation items, then it will show an empty module, which looks tacky, at least on the default Joomla! 1.5 template.

Hopefully, this sheds a little light on the subject of Split Menus and gives you new insight of another of the many new feature available in Joomla! 1.5.

Kenneth Crowder has been involved in the Joomla! Community since the days of Mambo. He has volunteered many hours to help out the Open Source Project. He is considered an expert in all things related to Joomla!. He was a Technical Reviewer for Joomla! A Users Guide, as well as another book currently in the editing phase. Learn more about Ken.

Trackback(0)
Comments (9)add comment

Matt said:

Thanks for this article. I have created a sub-menu on my site. I was wondering whether it is possible to create a further sub-menu?

My structure currently is:

Section
-Category

With category in the sub-menu. I would like the structure to be:

Section
-Category
-Article

With the article in a sub-menu which only appears once a category is clicked on.

Do you know how to achieve this?
 
report abuse
vote down
vote up
June 04, 2008
Votes: +0

Kenneth Crowder said:

@Matt - Yes, it is possible to create as many sub-menus as you wish. You just have to use the Menu Item Manager to create the new menu item and choose the correct "parent".

More information can be found here:
http://docs.joomla.org/Screen.menus.15
http://docs.joomla.org/Screen.menus.edit.15
 
report abuse
vote down
vote up
June 05, 2008 | url
Votes: +0

Étienne said:

Hi,
First, thanks for this article, I was looknig for this since a long time.

I used to have on top menu with 5 links, so 5 other menus displayed on the left once selected on the top menu.

I changed this to have a single menu, the top menu displays only the 0-1 depth item, andthe left menu deisplays the 1-5 sub-menu item.

But once I click on an article in the left menu, the article is shown but the left menu disapears, very strange (it's supposed to be shown on every page).

Any idea why ? Thanks a lot.

->
 
report abuse
vote down
vote up
June 16, 2008 | url
Votes: +0

Kenneth Crowder said:

@Étienne - Log into your Joomla! Administrator. Go to "Extensions" -> "Module Manager". Find the module that contains your submenu and open it. In the "Menu Assignment" section, make sure that "Menus" is set to "All". Repeat for module that contains your top level menu item (probably "Main Menu"). If it still does not work, then you should then look at other factors on your site. Best of luck!
 
report abuse
vote down
vote up
June 16, 2008 | url
Votes: +0

Chris said:

Nice tip Kenneth! Funny thing is that i have played with the new menu loads of times and completely missed the split option! smilies/wink.gif
 
report abuse
vote down
vote up
June 16, 2008 | url
Votes: +0

Amit said:

Kenneth,

I have been trying to accomplish on my site. It works to an extent. It does show the sub items on the split menu but it does not show the parent menu item holding them. I have tried all the start and end levels. Can't seem to break the mystery. Any help would be greatly appreciated.
Thanks,
 
report abuse
vote down
vote up
June 21, 2008 | url
Votes: +0

Kenneth Crowder said:

@Amit - Please see my comment from "June 16, 2008". It should give you the direction you are looking for.
 
report abuse
vote down
vote up
June 21, 2008 | url
Votes: +0

David said:

Thanks for this article!

So I changed the end level of my topmenu to 1. Then I created a new menu, called submenu with start level 1, end level 5.

But how can I tell my submenu to show the correspondenting subnavigation item when I click on a topmenu item?
 
report abuse
vote down
vote up
August 13, 2008
Votes: +0

Kenneth Crowder said:

Make sure your module is published and it showing on all pages. If this does not work, then something is not right in your settings. Once that is working, then you can tell Joomla! to only show it on certain pages.
 
report abuse
vote down
vote up
August 13, 2008 | url
Votes: +0

Write comment
quote
bold
italicize
underline
strike
url
image
quote
quote
smile
wink
laugh
grin
angry
sad
shocked
cool
tongue
kiss
cry
smaller | bigger

security image
Write the displayed characters


busy