homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

adding active class to list item in Magento
to apply styles to the current page

5+ Year Member

Msg#: 4341846 posted 6:37 pm on Jul 20, 2011 (gmt 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]



WebmasterWorld Senior Member 5+ Year Member

Msg#: 4341846 posted 9:51 am on Jul 23, 2011 (gmt 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.

Adam at work

Msg#: 4341846 posted 8:02 pm on Jul 26, 2011 (gmt 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.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved