show "active" section in custom graphic menu?

Posted by robhybrid on September 26, 2008 at 10:22pm

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

Comments

.CSS Injector

Posted by NonProfit on September 27, 2008 at 3:41am

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

Posted by robhybrid on September 27, 2008 at 11:57pm

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

Posted by NonProfit on September 30, 2008 at 5:07pm

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.

Posted by robhybrid on October 1, 2008 at 10:12pm

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!

Posted by NonProfit on October 7, 2008 at 8:03pm

Looks good, thanks for posting your code. -NP