Page 1 of 1
How to hightlight active menu links in top navigation?
Posted: Thu Mar 26, 2015 9:05 pm
by SWAR
Hello,
categories works fine for me (have orange background) but pages from "informations module" don't have background.
I see, if I click on category, in source there is <li class="active_link"> but if I open some other page, there is no class for li.
http://e-polis.royalmedia.sk/epolis-a-my
Can you help me?
Re: How to hightlight active menu links in top navigation?
Posted: Fri Mar 27, 2015 11:45 pm
by SWAR
bump
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 12:07 am
by chulcha
Code: Select all
href = location.pathname.substr(1)
$('#menu a[href*="'+href+'"]').parrent().addClass('active_link')
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 12:09 am
by SWAR
Where do I need add this?
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 12:28 am
by chulcha
SWAR wrote:Where do I need add this?

header.tpl
after block
Code: Select all
<div id="menu">
.....
</div>
<script>
$(document).ready(function(){
my code
})
</script>
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 1:12 am
by SWAR
Doesn't work..
Code: Select all
<div id="menu-holder">
<?php if ($categories) { ?>
<div id="menu">
<ul>
<li class="home_icon"><a href="/" alt=""></a></li>
<?php foreach ($categories as $category) { ?>
<li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
<?php } ?>
<li><a href="/epolis-a-my">E-polis a my</a></li>
<li><a href="/blog" style="font-weight: 300; font-size: 17px; font-family: 'Rock Salt', cursive;">Blog</a></li>
<li><a href="/klienti">Klienti</a></li>
<li><a href="/index.php?route=information/poradna">Poradňa</a></li>
</ul>
</div>
<script>
$(document).ready(function(){
href = location.pathname.substr(1)
$('#menu a[href*="'+href+'"]').parrent().addClass('active_link')
})
</script>
<?php } ?>
</div>
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 1:49 am
by chulcha
$(document).ready(function(){
my code
})
What is it?
my code:
http://forum.opencart.com/viewtopic.php ... 97#p551997
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 1:52 am
by SWAR
I had your code there.. it doesn't work with your code, check it now
btw with your code sliders don't load on homepage
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 2:26 am
by chulcha
Sorry
Code: Select all
href = location.pathname.substr(1);
$('#menu a[href*="'+href+'"]').parent().addClass('active_link')
Re: How to hightlight active menu links in top navigation?
Posted: Sat Mar 28, 2015 10:19 am
by SWAR
Works perfect, thank you

Re: How to hightlight active menu links in top navigation?
Posted: Sat May 21, 2016 4:04 am
by beebee
chulcha wrote:Sorry
Code: Select all
href = location.pathname.substr(1);
$('#menu a[href*="'+href+'"]').parent().addClass('active_link')
Hi Chulcha,
Thank you for the above script. However, I would like to know if you have any thoughts on doing the same for the links that are in the
My Account page? I'm having a tough time figuring this account. The "Account" page doesn't highlight the
ACTIVE link. When I hover through the buttons, it changes color, but when I click on it, though it takes me to the correct page, it doesn't show that page as active on the bar.
Thanks in advance for your help!