How to set isotope gallery filter button as focused by default on load?

Is there a way to make it so my “personalities” button is in its focused state or clicked-upon state when my portfolios page loads? Right now it’s not “focused” upon load but I’d prefer for it to be to just add some clarification as to what people are looking at. Thanks!

Read Only is: https://preview.webflow.com/preview/kristinepaulsenphotography?preview=018969735d3025b01cfac002cbd7c3e2

@KPMT Hi)
It is necessary to look at the project from the inside. Show your Read-Only link

i think its enoug to understand
https://petz4u.com/

Following this logic, I can answer that she need to apply an Interaction)
Applied to the first element Initial state an active CSS style

@bro-design the link is: https://preview.webflow.com/preview/kristinepaulsenphotography?preview=018969735d3025b01cfac002cbd7c3e2

My JS skill is no good, but I see solution here: javascript - Add and remove class onClick action - Stack Overflow

So, your tab class name is “.button.editorial” you need add new class to the first tab like as “.isotope-active”, style it as you want.

Then you can add this little script in Before Body Tag:

<script> $(".button.editorial").click(function (e) { $(this).addClass("isotope-active").siblings().removeClass("isotope-active"); }); </script>

Result you can see here:
http://broplayground.webflow.io/how-to-set-isotope-gallery-filter-button-as-focused-by-default-on-load

Read-Only link: https://preview.webflow.com/preview/broplayground?preview=199fd3556254ef8e33b2beec09ee2264

Write If you have any questions :v::blush:

1 Like

Thank you @bro-design!

I think I must be doing something wrong, though, because I can’t get this to work.

Did I do something wrong when creating the new class?

Here’s what I’ve got:

32%20PM

Thanks for your help with this!

Oooh wait, nevermind! I think I got it!

I just didn’t really understand what that script was saying. So basically, I create the new class “isotope-active” and then style it to look active.

Then the script removes that additional class when I click on other tabs so it goes back to behaving normally, yes?

Thank you so much for your help!!