Change navigation (sublinks) according to main menu (headlinks)

Question

I would like to create a main menu with some links in it. And when you click on a link in the submenu, the content of the navigation menu changes according to the link clicked in the main menu (= subnavigation elements). Here is an image to clarify:

I now have a main menu and a navigation, but the links stay the same for this moment. So now I would like to get the navigation to be dynamic. How could I do this the best way?

Answer 1

The easiest way will be to create a menu for each top level menu page.

Then put all those menus as blocks in your sidebar region, with a rule so they only appear on the correct page, or subpages.

E.g.

Menus:

Top Menu:  Home | News | Blog
    // show on all pages

Home Menu: Info | About
    // show on home and home/*

News Menu: Current | Archive
    // show on news and news/*

Blog Menu: My Blogs | Other Blogs | Archive
    // show on blog and blog/*

Pages

/home
/home/info
/home/about
/news
/news/archive
/blog
/blog/other
/blog/archive

So, step by step instructions would be:

1. Create a main menu for your site.
2. Add items for Home (URL: /home), News (URL: /news) and Blog (URL: /blog) to your main menu.
3. Create another menu called Home.
4. Add pages info (URL: /home/info) and about (URL: /home/about) to this menu.
5. Add this menu to your theme in a block. Set the block visibility to only appear on "home" and "home/*". This is the clever bit because the submenu for home page will appear on the main /home page, and also any subpages of that as long as you follow the url structure.
6. Repeat same process for the news and blog menu so now each of your sub-menus only appear on their specific pages.
7. Do a little dance (can even have a sing if you want).
8. Done.