2

I want to conditionally add some CSS to a subnav element if that page in the subnav is currently active. However, I can't add the CSS based on any slug / URL / getSegment logic, as that will likely be changed down the road. I also can't use the ID of the page.

The pages in this subnav are part of the same structure and it seems to me the best way to set the rule would be based on the order of the page in the structure. Something like if page 2 in craft.entries.section('') is active then apply CSS to target element.

Is this possible in Craft? If so, how would I do that? If not, other ideas for how to approach it?

Improve this question
2
  • Using the entry position is possible, but sounds even sketchier than using a slug. Moving the entry within the structure would instantly break that. Is the entry nested below another entry? Can you use the ID of the parent entry? – Lindsey D♦ Dec 11 '15 at 23:09
  • @LindseyD I have five entries under one parent. On all pages there is a subnav table with the six entries listed (including the parent). The subnav is ordered sequentially from left to right. The names in the subnav are set by the order of the entries. So if an entry moves from 2 to 3 in order, the 2nd & 3rd names in the subnav change. I would like the active entry to be bolded in the subnav, regardless of its position in the table. However, if I set-up the logic to say bold this cell if the ID of the entry is xyz, and its position changes, the same cell is bolded but for a different title. – dpayne Dec 11 '15 at 23:23
2

The craft_structureelements table contains the data you need to determine the exact position & level of each entry in your structure. But you'd need some fancy plugin logic to attack that data and use it to your advantage.

In all honesty, I really feel like you're going the wrong way on this, and you're better served trying to find a way to make the slug or id work for you. The sole purpose of a slug is to identify a specific page.

How about this...

When you dynamically generate your nav, add a CSS class with slug of that nav item. Then, you can verify that against the slug of the page which is being loaded. Even if the slug changes, it'll change in both places simultaneously.

Improve this answer
1
  • Ah - brilliant! Your suggestion at the bottom on the slug was the ticket. Thanks so much! – dpayne Dec 12 '15 at 0:04
1

You're going to need some kind of context as to what is "current"; the context you have is in craft.request -- I'm not sure what else you'd use, other than slug / URL / getSegment logic.

Improve this answer
1
  • Right, exactly what I'm struggling with. I provided some additional context for Lindsey D above if that helps. – dpayne Dec 11 '15 at 23:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.