show "active" section in custom graphic menu?
robhybrid - September 26, 2008 - 22:22
I'm new to drupal and I'm creating a theme to match a mock-up that I made for the client. The testing server is at:
http://hanger4.inet7.com/pages/
I'm using the Zen theme. I deleted most of the header section from page.tmp.php and replaced it with a graphic top nav menu I built. I want these to appear red when you're viewing a page under it's corresponding section. I have the graphics ready. Is there a simple variable or array that's available to page.tmp.php that I could use to determine what section I'm under?
I need to provide it this way so that it looks like the mock up, instead of using the drupal generated top nav.
Thanks
—Rob
.CSS Injector
Hey Rob, I just implemented this on one of my sites with CSS Injector. Launch your site and find the id for your menu item.
I entered the .css code:
.menu-209 a {background-color:#ffffff !important;
color:#A57F5C !important;
}
to change the font and background colors.
I then limited the display to the page represented in menu-209. (node/#)
.CSS Injector works great but is only available for 6.x. The downside is you need to create a new rule for every menu item.
Hope this helps. Blessings!
-NP
PS: Also, check out some cautions here.
re: .CSS Injector
NP,
Thanks for the advice. I'll certainly check it out, but I need to replace images. The menu items don't have IDs yet. They're not dynamically generated by drupal. The top nav is a graphic table on my site. I built it and replace the code that generates the top nav with my own mark up. I might change them into background images and then switch them out using CSS. Then, I could get rid of the javaScript roll-overs as well. My main question is how can I write something that will still work if the client creates a new page under one the main sections.
Thanks,
—Rob
css background images
Hey Rob,
Swapping images should be no problem. Just use background images in your css. Not sure about the rest.
Post your results when you find a solution, others will be looking for this someday.
Blessings!
-NP
solution.
I ended up writing a function that uses node id number to tell what page it's on. I'd rather have something that would just know what section it's in, but I can just add node numbers to these array as we add pages.
<?php
#substitutes names for images to create stickieness in topnav
$slice4_nodes = array(1,6,7,8,9,10,11,12,13,14,15,16,17);
$slice5_nodes = array (2,18,19,20,21);
$slice6_nodes = array (3);
$slice7_nodes = array (4);
$slice8_nodes = array (5);
$this_node = $node->nid;
function check_page ($this_node, $nodes_array) {
if ( in_array($this_node, $nodes_array) ) {
return ("sticky"); } else {
return ("off");
}
}
$slice4 = check_page($this_node, $slice4_nodes);
$slice5 = check_page($this_node, $slice5_nodes);
$slice6 = check_page($this_node, $slice6_nodes);
$slice7 = check_page($this_node, $slice7_nodes);
$slice8 = check_page($this_node, $slice8_nodes);
?>
Thanks!
Looks good, thanks for posting your code. -NP