I have a collection of people, that I'd like to have sort filters visible on the front-end to sort the members by tags I've associated. In this case the tags are leadershipteam, featuredexperts and bod. I believe I've figured out how to sort them using the ?sort=tag a href, but what I don't know how to do is make the URL links active, so that I can have a change of color associated with the active fitler.
So, what I'm looking for is what is the css, or how do I call the link that is actively sorted to make it look different than the other links?
I believe an example of what I'm trying to do is shown in the Statamic marketplace. For instance, when you are sorting by "Most Popular" - and the url is https://statamic.com/marketplace/addons?sort=most-popular then the link MOST POPULAR is given a hotpink styling.
Here's my code:
<article class="content">
<p>
Sort by: <a href="/about">All</a>
<a href="?sort=leadershipteam">Leadership Team</a>
<a href="?sort=featuredexperts">Featured Experts</a>
<a href="?sort=bod">Board of Directors</a>
</p>
Sort by: All
Leadership Team
Featured Experts
Board of Directors
{{ collection:people :taxonomy:tags="get:sort" }}
{{ assets:headshot }}
{{ /assets:headshot }}
{{ title }}
{{ position_title }}
{{ /collection:people}}