cancel
Showing results for 
Search instead for 
Did you mean: 

Add 'active' class to CMS page links in Top menu (static block links)

SOLVED

Re: Add 'active' class to CMS page links in Top menu (static block links)

Great and thanks a lot. Its working.

 

Last issue:

 

1) When you click a post and you view the URL e.g. blog/test-post-4/. Now my homepage gets .active state again? But now /blog/ should be highligted.

 

What do i have to do, to make the child-posts of the Blog-link (blog/test-post-4/) also adds the .active class to the mother /blog ?

 

Thank a lot for your support.

Re: Add 'active' class to CMS page links in Top menu (static block links)

Dear AddWeb Solution Private Solution,

 

did you see my reply about the individual blog-pages? So a .active class for all individual blog-pages behind /blog/. E.g. blog/test-post-4/ (now /blog/ should be highlighted)?

 

Thanks a lot!

Re: Add 'active' class to CMS page links in Top menu (static block links)

Goto your topmenu.phtml file app\design\frontend\mypackage\mytheme\template\page\html\topmenu.phtml

Replace your script with the below script:

<script>
jQuery(document).ready(function(){
jQuery(function() {

var url = window.location.pathname; //sets the variable "url" to the pathname of the current window
var activePage = url.substring(url.lastIndexOf('/') + 1); //sets the variable "activePage" as the substring after the last "/" in the "url" variable
var n = url.indexOf("/blog"); 
if(n >= 0) {
activePage = 'blog';
}
jQuery('.nav-primary li a').each(function () { //looks in each link item within the primary-nav list
var linkPage = this.href.substring(this.href.lastIndexOf('/') + 1); //sets the variable "linkPage" as the substring of the url path in each &lt;a&gt;

if (activePage == linkPage) { //compares the path of the current window to the path of the linked page in the nav item
jQuery(this).parent().addClass('active'); //if the above is true, add the "active" class to the parent of the &lt;a&gt; which is the &lt;li&gt; in the nav list
}
});

});
});
</script>

 

Hope this helps you surely!

Query solved? Accept as Solution.Thanks
Eric Baily

Re: Add 'active' class to CMS page links in Top menu (static block links)

Hi i discovered  a small issue. 

 

- E.g i am on English homepage the link 'Introduction' is highlighted. 

- After when i select another language (e.g. Netherlands), ALL other cms links are highlighted now exccept 'Introduction' ??

 

There is a difference now between:

 

http://www.meesfrenkelfrank.com/magento/nl

and:

 

http://www.meesfrenkelfrank.com/magento/nl/

How do i tackle this issue?

Re: Add 'active' class to CMS page links in Top menu (static block links)

Forget my latest post! I forgot in my Dutch static block, to add the links with 'Insert widget' > CMS Page link. Now its working..!