Add active class on filter list

Kirby 3 Solved ✅
1

Hi,

I’ve build a filter list based on the YT tutorial. Now I want to assign an active class to the current filter.

I’ve tried the code in this forum post:

<ul id="filter">
	<li><a <?= param('') === null ? 'class="active"' : '' ?> href="<?= $page->url() ?>">All</a></li>
	<li><a <?= param('filter1') === null ? 'class="active"' : '' ?> href="<?= $page->url() ?>?filter=filter1">Filter 1</a></li>
	<li><a <?= param('filter2') === null ? 'class="active"' : '' ?> href="<?= $page->url() ?>?filter=filter2">Filter 2</a></li>
</ul>

Alas, now all of my links have the active class assigned and I can’t figure out what’s wrong.

Any help much appreciated :slight_smile:

2 
filter">
	<li><a <?= param('filter') === null ? 'class="active"' : '' ?> href="<?= $page->url() ?>">All</a></li>
	<li><a <?= param('filter') === 'filter1' ? 'class="active"' : '' ?> href="<?= $page->url() ?>?filter=filter1">Filter 1</a></li>
	<li><a <?= param('filter') === 'filter2' ? 'class="active"' : '' ?> href="<?= $page->url() ?>?filter=filter2">Filter 2</a></li>
3

Thank you! But now the active class is always assigned to the first item (All), no matter which filter I select. :thinking:

4

I only saw the first part, you are not even using parameters but a query string, so using param is wrong and you have to check get('filter') instead.

5

You mean $obj->get()? Sorry, I’m a bit lost here.

6

No, like I wrote, repplace param('filter') with get('filter')

1 Like
7

Ahh, fantastic! Thanks a lot!