link.active for a different page - help

Shopify Partner
49 0 1

Hi there,

This many be a really dumb question and my lack in understanding liquid will stand out here, but I need help with the link.active code please.

I am trying to highlight (make active) a link in the main navigation when a different page is current.
For instance - If my page.title = solutions by sign system, I would like the "signage-solutions" link to be active in my main menu.

It's probably something pretty simple with an if statement, but I'm not so hot with the liquid coding...

Any help would be greatly appreciated. Thanks!

0 Likes
Shopify Staff (Retired)
Shopify Staff (Retired)
5711 0 122

Hard to say without your code or a link, but you probably just need something basic like this:

 

<li><a href="#" {% if page.handle == 'my-page-handle' %} class="active"{% endif %}>My Page Handle</a></li>

You may need that on your li element. Not sure how you're doing your menu.

 

http://shopifyplus.com ::: http://twitter.com/bacchus
0 Likes
Shopify Partner
49 0 1

Hi Jamie, thanks for replying to my post and for your suggestion!
You're right - it's not very nice to leave out the code and site link:

http://mirtec.myshopify.com/
password - rtipir

code:

  <div id="navigation-main">
  <ul class="navigate-main">
    {% for link in linklists.main-menu.links %}
    <li><a href="{{ link.url }}" {% if link.active %}class="active"{% endif %}>{{ link.title }} </a>&nbsp; &nbsp;</li>
       {% endfor %}
     </ul>
</div>

This is how I'm using my linklists, but I want to manually isolate a few situations where I want one of the links to be highlighted while a totally different page is current.
Basically, I'm trying to manually create a hierarchy of pages and links. So when you are in the top level of the navigation, that link will remain highlighted also when you "logically" step down in levels. I know Shopify doesn't allow for this, but I want my visitor to always know where they are logically.

This is the logical hierarchy of a particular set of pages on my site:

level 1 - http://mirtec.myshopify.com/pages/signage-solutions
level 2 - http://mirtec.myshopify.com/pages/solutions-by-sign-system
level 3 - http://mirtec.myshopify.com/pages/venus

I would like all these pages (when current) to activate/highlight the "signage solutions" link at the main navigation bar, which is their logical parent.

 

 

 

0 Likes
Shopify Partner
49 0 1

Hey, everybody,

Any ideas?

I'd love to have this work out and I feel like an idiot that I can't figure it out on my own.

Any help would be so appreciated....

0 Likes