I'm trying to figure out how to build a two-level navbar for use in a Drupal-themed site. Ideally, this navbar should have the primary links (listed horizontally) on the upper level of the bar, and the secondary links for the chosen primary link listed on the lower level of the bar. When a new primary is selected, the secondary navbar changes to show only the appropriate secondary links, but all primary links remain unchanged (except that the selected primary link remains highlighted).

An example of what I want to do is at http://www.kindercare.com.

I would think this would be easy to do by placing the primary and secondary links in the navbar (depending on the theme, of course). I've been working with Zen, but probably could be convinced to switch to a different theme and modify it as needed, as I just can't seem to get it to work.

Would I be better trying to code this with CSS? There seem to be tons of examples of flyout or dropdown menus, but I can't find any to do this seemingly simple task.

Comments

da bengals’s picture

I'd like to do the aforementioned with CSS only (if I can't do it with Drupal), but I'm beginning to wonder if I need to set up a MySQL database to hold the menu items onclick.

Suggestions?

xstevex’s picture

Zen doesn't leave the primary highlighted when you click on one of its secondary links. But aberdeen does. With a bit of fiddling with the css you could probably make zen do the same. But aberdeen already has it coded into the css. Probably there are other themes too that have it already.

From your question I'm not sure if you realize how easy it is to make the secondary links you're after. You just add a new primary link and make its parent one of the existing primary links, then the new "primary" link becomes a secondary link. And it turns out exactly as you describe in your question.

Steve.

da bengals’s picture

Hi Steve:

I installed Drupal 5.7 and Aberdeen. I set up some Primary links, and the subordinate links that I want as primary links with the appropriate Primaries as their parent. However, the second primary links don't appear.

Check out http://www.maddogdirect.com/LittleSteps2

You can see the parent tabs, but each of the second and third tabs have "primary links" that are secondary to these, but I can't figure out how to get them to show in a bar beneath these tabs.

Am I missing something?

NicoDruif’s picture

Hi there,

I want to achieve the same thing, and tried it with the four seasons theme (http://drupal.org/project/fourseasons), but am puzzled about keeping the primary links highlighted when on a second level link... I wrote a post about this as well: http://drupal.org/node/300641.

Thanks in advance!

www.druifdesign.nl