Colouring active links in the Navigation menu

I have also run into this problem, and it seems that the active class is not added to primary menu links in the dev version. On a hunch, I tried the official release, 0.6, and it works fine...except for the home page (using < front >). If I add the following code to the 0.6 release's template.php, the home page active class is added:

function phptemplate_menu_links($links, $attributes = array()) {

  if (!count($links)) {
    return '';
  }
  $level_tmp = explode('-', key($links));
  $level = $level_tmp[0];
  $output = "<ul class=\"links-$level ".$attributes['class']. "\">\n";
  foreach ($links as $index => $link) {
    $output .= '<li';
    if (stristr($index, 'active')) {
      $output .= ' class="active"';
    }// frontpage AND current-link in menu is <front>
    elseif((drupal_is_front_page()) && ($link['href']=='<front>')){
      $link['attributes']['class'] = 'active';//add class active to <li
      $output .= ' class="active"';//add class active to <a
    }
    $output .= ">". l($link['title'], $link['href'], $link['attributes'], $link['query'], $link['fragment']) ."</li>\n";
  }
  $output .= '</ul>';

  return $output;
}

function phptemplate_menu_item_link($item, $link_item) {
  static $menu;
  if (!isset($menu)) {
    $menu = menu_get_menu();
  }
  $mid = $menu['path index'][$link_item['path']];
  $front = variable_get('site_frontpage','node');
  $attribs = isset($item['description']) ? array('title' => $item['description']) : array();
  $attribs['id'] = 'menu-'. str_replace(' ', '-', strtolower($item['title']));
  if((($link_item['path']=='<front>') && ($front==$_GET['q'])) ||
    (menu_in_active_trail($mid))){
  $attribs['class'] = 'active';
  }
  return l($item['title'], $link_item['path'], $attribs);
}

For some reason, this does not work in the dev version.

I played around a bit more and seem to now have it working in the dev version. I used the code below to assign each menu item a unique CSS class, add in a first and last class, and have active class set when that menu item is active - even for the front page!

Put this code in template.php:

/**
 *  Implementation of theme_menu_links()
 *
 *  - using theme_links code to get specific menu classes e.g. menu-2-1-1, and first & last classes
 *  - added in code for front_page active link handling.
 *
 **/

function phptemplate_menu_links($links, $attributes = array()) {

  $output = '';

  if (count($links) > 0) {
    $output = '<ul'. drupal_attributes($attributes) .'>';

    $num_links = count($links);
    $i = 1;

    foreach ($links as $key => $link) {
      $class = '';

      // Automatically add a class to each link and also to each LI
      if (isset($link['attributes']) && isset($link['attributes']['class'])) {
        $link['attributes']['class'] .= ' ' . $key;
        $class = $key;
      }
      else {
        $link['attributes']['class'] = $key;
        $class = $key;
      }

      // Add first and last classes to the list of links to help out themers.
      $extra_class = '';
      if ($i == 1) {
        $extra_class .= 'first ';
      }
      if ($i == $num_links) {
        $extra_class .= 'last ';
      }
      if((drupal_is_front_page()) && ($link['href']=='<front>')){ //check if front page
        $link['attributes']['class'] = 'active';                      //add class active to <li
        $class .= ' active';                                          //add class active to <a
      }
      $output .= '<li class="'. $extra_class . $class .'">';

      // Is the title HTML?
      $html = isset($link['html']) && $link['html'];

      // Initialize fragment and query variables.
      $link['query'] = isset($link['query']) ? $link['query'] : NULL;
      $link['fragment'] = isset($link['fragment']) ? $link['fragment'] : NULL;

      if (isset($link['href'])) {
        $output .= l($link['title'], $link['href'], $link['attributes'], $link['query'], $link['fragment'], FALSE, $html);
      }
      else if ($link['title']) {
        //Some links are actually not links, but we wrap these in <span> for adding title and class attributes
        if (!$html) {
          $link['title'] = check_plain($link['title']);
        }
        $output .= '<span'. drupal_attributes($link['attributes']) .'>'. $link['title'] .'</span>';
      }

      $i++;
      $output .= "</li>\n";
    }

    $output .= '</ul>';
  }

  return $output;
}

It looks like this has already been fixed.

Zen uses the standard theme('menu_links', $primary_links); to generate its menu links. The active class is added automatically. But a menu item to the homepage will never get an active class; that is a bug in Drupal core.

I take it back. menu_links isn’t standard. theme('links', ...) is.

See http://drupal.org/node/122592

Although this thread asserts that this problem is fixed, I cannot find a way to add color to active links in the navigation menu. I'm using ZEN 1.0.

I'm an admitted CSS neophite, so I'm sure that I'm not following all the nuances of this thread. However, I've tried making changes in just about every .CSS file in my subtheme with no success. I was especially disappointed when the changes that I made in the "Menu Styles" and "Link Styles" sections of the my_sub_theme.CSS had no affect. (I tried to duplicate the existing #secondary a:hover class but the duplicate psudoclasses I made for "visited", "link", and "active" did not work. And the "hover" functionality does not appear to work to begin with... is this a known bug? I couldn't see anything on it in the ZEN bug list.)

Can provide an example or direct me to information on how to modify the my_sub_theme.CSS file to add different colors to the navigation menu links for "link", "visited", "hover", and "active" pseudo classes?

Thanks!

Don, I highly recommend getting the Firebug plugin for the Firefox browser: http://www.getfirebug.com/ It will show you which styles (and from what stylesheets) are being applied to any elements you click on.

The CSS link styles work perfectly. I've tested them many times and there have been no bug reports on that. I suspect either 1.) you didn't follow the installation and sub-theme creation instructions correctly, or 2.) you need some basic CSS training. If you are still having issues, please open a new issue instead of opening up a closed issue.