By ttiurani on

I have an issue with the "active-trail" class not showing up on <li> for menu items with Drupal 7.14. The problem I have is that "active-trail" is missing for only a menu link to the front page (path "<front>"), all other links have "active-trail" just fine.

The situation is also slightly different for the horizontal primary link tabs that can be switched on from theme settings Toggle display - Main menu, than they are for the vertical navigation in the Main menu block. In the horizontal tabs the front page <li> has "active" but not "active-trail". So "active" could be used to do get around this issue for horizontal menus. But unfortunately I want the vertical menu and in that there is no "active" nor "active-trail".

I also tried different themes and created a new testmenu with a link to the front page with exactly the same problem.

So I suspect this might have something to do with "<front>" not being handled properly?

Is this a bug or a feature of Drupal 7 and has anyone else noticed this? Any suggestions on how to proceed? I tried to search the bug database but did not find this particular issue (this is close but for D6), which is why I thought it best to first ask here.

⋅ Categories: Drupal 7.x

Comments

spovlot’s picture

spovlot commented

I don't think that the "active-trail" class is generated by Drupal core. The core theme_links() does add an "active" class.

Are you using a module such as Superfish or another menu building module? Does your theme have drop down menus? Maybe the problem is specific to that.

ttiurani’s picture

ttiurani commented

I verified that both "active" and "active-trail" are missing with a fresh install without any added modules on Drupal 7.4 to 7.14. The behaviour is identical with Bartik, Garland and Stark themes, as well as Zen.

Steps to reproduce:

1. Create a fresh install of Drupal 7.14.
2. On the front page go to Structure -> Blocks.
3. Move "Main menu" block to "First sidebar"
4. Create a new "Basic page" with test content and click "Provide a menu link" -> "Parent item" [Main menu]
5. Use e.g. Firebug to verify that the newly created test page link on the sidebar has "active-trail" on <li> but "Home" does not.

This surely isn't how it's supposed to work? If this is not a bug, can someone help me get around my original problem:

How can I create a .css file that increases the upper and lower margin for the "Home" link in the sidebar "Main menu" when I am on the front page? Because of this issue, there are no class that changes for the "Home" <li> when it is active. I can increase the margins for all the other links that have "active-trail" with:

li.active-trail {
  margin-top: 12px;
  margin-bottom: 12px;
}

but not with the "Home" link. Ideas?

ttiurani’s picture

ttiurani commented

So I dug around and found the problem. As I suspected <front> handling was missing. The file was "includes/menu.inc" which I suspect is Drupal core?

This is my first contribution to Drupal, so I don't quite know what is the right way to submit this issue. I suspect I should to create a bug and attach this patch there and hopefully it will get to some future version of D7? The patch below is against the 7.14 tag, should I do it against some other tag/branch?

From bbb5b9c51a977b94bdd6789495177d93e60b1873 Mon Sep 17 00:00:00 2001
From: Timo Tiuraniemi <timo.tiuraniemi@iki.fi>
Date: Mon, 14 May 2012 16:44:28 +0300
Subject: [PATCH] Fixed problem with active-trail class missing for <li> if link pointed to <front>

---
 includes/menu.inc |    6 ++++--
 1 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/includes/menu.inc b/includes/menu.inc
index b25a374..91817d0 100644
--- a/includes/menu.inc
+++ b/includes/menu.inc
@@ -1043,8 +1043,10 @@ function menu_tree_output($tree) {
     else {
       $class[] = 'leaf';
     }
-    // Set a class if the link is in the active trail.
-    if ($data['link']['in_active_trail']) {
+    // Set a class if the link is in the active trail,
+    // or if this is the front page and link points to the front page
+    if ($data['link']['in_active_trail'] 
+        || (drupal_is_front_page() && $data['link']['href'] == '<front>')) {
       $class[] = 'active-trail';
       $data['link']['localized_options']['attributes']['class'][] = 'active-trail';
     }
-- 
1.7.3.4
spovlot’s picture

spovlot commented

You need to open an issue in the Drupal Core queue at http://drupal.org/project/issues/drupal

Please restate the summary of the issue and post your fix there.

Perhaps post back that core issue # here to wrap this up.

ttiurani’s picture

ttiurani commented

Thanks for your help!

I created an issue here:
#1578832: [already commited but followup for CR?] <front> menu links are missing active trail classes

ttiurani’s picture

ttiurani commented

As a workaround, until the above bug is fixed, the menu_block module can be used. It adds the "active" class also to <li> which can be used to target the active menu item. However "active-trail" is missing from menu_block menus as well presumably because of the same bug.

matulis’s picture

matulis commented 
function YOURTHEMENAME_menu_link($variables) {
  $element = $variables['element'];
  $sub_menu = '';

  if ($element['#href'] == '<front>' && drupal_is_front_page()) {
    $element['#attributes']['class'][] = 'active-trail';
  }

  if ($element['#below']) {
    $sub_menu = drupal_render($element['#below']);
  }
  $output = l($element['#title'], $element['#href'], $element['#localized_options']);
  return '<li' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}

Aigars Matulis
eSoulution

pazitiff’s picture

pazitiff commented

Thank you! it's working!!!

ReBa’s picture

ReBa commented

Thank you for this sollution!

emilovbg’s picture

emilovbg commented

This add class "active", but "active-trail" is missing.

Leon.Jiang’s picture

Leon.Jiang commented

another way:
change the menu link from to node will fix this problem

kari.kaariainen’s picture

kari.kaariainen commented

(That probably was supposed to read "from <front> to node")

But then clicking the front page menu item will end up in www.example.com/node, and on www.example.com the menu item still doesn't have active trail.