Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

adding active class to list item in Magento

to apply styles to the current page

6:37 pm on Jul 20, 2011 (gmt 0)

Junior Member

5+ Year Member

joined:July 29, 2009
posts: 46
votes: 0

the blog link on the main nav wont hold the active state (like all the other buttons do)

i added the blog link myself and the other links are part of and generated by the cart software itself (magento). so I am adding a CMS link to the nav

i added this:
 <li <?php if ($this->getRequest()->getRouteName(Mage_Core_Model_Url_Rewrite::REWRITE_REQUEST_PATH_ALIAS) == 'blog') { echo 'class="active"'; } else { echo 'class="blog"'; } ?>><a href="<?php echo $this->getUrl('blog')?>"><span><?php echo $this->__('Blog') ?></span></a></li>

and tried this too:
 <li <?php if ($this->getRequest()->getRouteName(Mage_Core_Model_Url_Rewrite::REWRITE_REQUEST_PATH_ALIAS) == 'blog') { echo 'class="active"'; } else { echo 'class="level0 nav-3"'; } ?>><a href="<?php echo $this->getUrl('blog')?>"><span><?php echo $this->__('Blog') ?></span></a></li>

no go

[edited by: alt131 at 9:48 am (utc) on Jul 23, 2011]
[edit reason] Thread Tidy [/edit]

9:51 am on July 23, 2011 (gmt 0)

Senior Member

WebmasterWorld Senior Member 5+ Year Member

joined:Aug 9, 2008
posts: 961
votes: 0

Any Magento experts out there?

There's been some background discussion about this, and the issue is that Magento uses the class "active"* to apply styles to the list item in the main meu that contains the link to the current page:
#nav li.over, #nav li.active {
background: none repeat scroll 0 0 #ECECEC;
border: 1px solid #BBBBBB;
margin: 0 7px 10px 0;

Bob has added a new "Blog" page and the trouble has been writing the correct code so the cms will apply the "active" class when the Blog page is the current page, but without applying it permanently.

At this stage this has successfully applied the styles to the <li> when the Blog page is the current page.
<li class="level0 nav-98 parent <?php if (strpos(Mage::helper('core/url')->getCurrentUrl(),'blog') != false ) :?> active<?php endif;?>"> <a href="<?php echo $this->getUrl('blog') . 'blog' ?>"><?php echo $this->__('BLOG') ?></a>

However when caching is activated in the admin, the active class is being applied to the Blog page when on the "home" page as well.

*Note this is not the :active pseudo class - the cms has a class .active which is being used to apply styles to the current page.
8:02 pm on July 26, 2011 (gmt 0)

New User

joined:July 26, 2011
posts: 1
votes: 0

It might be a shot in the dark, but have you tried deleting the cache? I'm not sure what version of magento you are running, but from my experience with older versions of magento sometimes just renaming the entire cache folder is needed to completely clear the cache.

Also, I don't know off hand what the following returns.

But if it returns "blog" it will wind up not matching (since the needle position will be 0 which == false). Alternatively if it returns a url with the string "blog" anywhere in it(including the domain name), it will wind up matching.