Thread

This question may be related to a resolved thread.

Hello,

The magazine site I’m developing has a single article-view template that displays a list of all the site-wide article categories (called “Article Topics”) in the sidebar. For the single article being displayed, it’s specific Article Topics need to be given an “active” or “current” CSS class in order to be highlighted. The issue I’m having now is: how can I conditionally add a class to a dynamically generated categories list without, again, being able to utilize url segments (these Article Topics—the article’s categories—don’t appear in the url)? Here’s the code I’m dealing with:

I need to have this…

<h5 class="articleTopics">Article Topics</h5>
{exp:channel:categories channel="journal|primer" style="nested" category_group="10" class="list1"}
   <a href="http://{path=finelife-journal/show}">{category_name}</a>
{/exp:channel:categories}

...dynamically generate this HTML (note the “current” class on the second <li> denoting the article in question):

<h5 class="articleTopics">Article Topics</h5>
     <ul class="list1">
        <li><a href="#">economics</a></li>
        <li class="current"><a href="#">business</a></li>
        <li><a href="#">ecology</a></li>
       ...
     </ul>

I’m sure this involves the use of conditionals but I’m not sure where to place them. This is a case of knowing it can be done and just not knowing how.

Thanks.

-Gamiel

You can use the {category} looping pair to display what categories an article is assigned to, but I’ve never seen a way to highlight just those categories on a site-wide master list from a single entry page.

Hi Mike,

Thanks for the reply. As you can see here, the site for (the now defunct) Seed Magazine accomplished something along the lines of what I’m looking to do—ie, listing all the article categories (“Tags”) in a sidebar and highlighting the only ones assigned to the single article by giving the <li> an “active” class. When they were publishing, they used ExpressionEngine as their CMS as stated in this interview with their web developer.

So apparently it can be done. I may have to look into the Tag Module add-on that they used.

-Gam

(Great EE book by the way.)

Thanks - glad to hear about the book!

Looking at the URLs of those sidebar links, they aren’t EE categories.  I suspect they used the Solspace tagging module and they are, in fact, implemented as tags.

Yeah, your book has been my go-to resource as I’m learning my way around EE.

I’m looking into that add-on. Perhaps I’ll be able to accomplish what I need with it. (It’s strange, this is something I thought would be rather easy to accomplish without any add-ons.)I’ll keep you posted…

Thanks again.

Thanks for tossing in, Mike! Yep, I’m not quite sure of a way to do what you’re looking to do natively, Gamiel. I’m not 100% sure, but an add-on that extends normal category functionality, like NSM Categories, might be very helpful.

Thanks, Kevin. There’s got to be a way to do it if seedmagazine.com did it. Hopefully they didn’t achieve it through esoteric means as I’m quite the novice with EE and PHP. But I’ll look into the add-on you recommended as well.

Okay, I’ve found an appropriate compromise. Until I find a better solution, the categories list for the Article Topics will be hard-coded and wrapped in Channel Entry tags. I can then apply the “current” class to the <li>‘s with conditional statements. It does limit editorial control in terms of being able to change categories at will in the control panel and have them match the template HTML. It’ll be fine for now, however, since I’m in charge of both technical and editorial.

The good news is that I’ve found out about some add-ons I can still use. Thanks again, Kevin and Mike.

-Gamiel

Hi Gamiel,

Some small solace, the categories tag pair has an “active” conditional variable available that you might helpful.

With that, is there anything else I can assist you with?

Cheers,

Hi Dan,

I actually didn’t know about the “active” variable (there’s a lot of documentation on EE for a self-taught coder!). While I probably can’t use it for this situation (it’s activated by URI), I may need it in the future. This is all a first for me so I’ll see…

Thanks for the tip, Dan. I think that’s it. For now.

-Gamiel

Hi Gamiel,

Indeed, the User Guide is far from perfect, but it is an excellent and thorough resource for sure!

If you have any other questions, please let us know!

Cheers,