I’m unable to style the current active menu item in Joomla 2.5. After much research and stuffing around it turns out that my problem is due to the fact that I am using a menu item type of “
menu item alias”.
The example below illustrates my problem.
Let’s say I have a menu item called “tutorials” when I click on it and go to that page, I want the
tutorials menu item to be styled differently so that the user knows that they are on the tutorials page. Unfortunately, there is no “current” class attached to the menu,so this makes it difficult (impossible?) to style the menu item that matches the current page.
- How can I style the current Joomla menu item when using menu item alias as the menu item type in Joomla 2.5?
- If I can't style it, is there a workaround? Either a hack or an alternative to menu item alias? Keep in mind that I don’t want to create duplicate content.
A class of
active is added to the current menu. Here is an example of what I am seeing when I click on the uppermost menu item.
The problem with that is that all the submenu items are also styled. How do you prevent that?? Here is the CSS of a submenu that is a child of the current menu item (note that the current page is for the uppermost menu item).
I've taken the answers on board and played around with the CSS some more. It turns out I was wrongly applying the CSS styling.
I should have used
li.active to style the menu item that matches the current page.