I’m creating a website for an architectural practice. Thanks to Finsweet, I can now easily create a complex filtering system which is embedded in the way the practice works- great stuff!
I’m currently struggling with a set up. I want to filter the projects first by type (architecture or urbanism) and then by themes (there’s a few of those). Is it possible to restrict the attribute to only allow one checkbox at a time? Currently, when i click on ‘architecture’ it does filter the projects but when clicked ‘urbanism’, it is showing all projects with both categories.
In the same vain, once I add the attributes to the themes (I haven’t added them yet), will I be able to achieve the result I’m after? I would like the visitors to be able to filter by type first and then by theme.
Hey @tinwid! If you are only looking to have one selection at a time the easiest way would be to switch the type filters to radio buttons as these have native or logic, multiple radios on the same group can not be selected at the same time.
Having both filter set with with radios will also solve you second issue, where user will only be able to choose only “Architecture” and only “Homes and Retrofit” for example.
Thank you so much for a quick reply! I will try and amend the design to see how it works. I shall keep you posted regarding the progress- thanks a lot once again!
So I managed to get the buttons to work (just need to add ‘clear filters’ and it should be all good!
However, I’m struggling with getting the ‘input active’ attribute. It seems to be misbehaving… I’m trying to get an effect when clicked on the type or theme, the selected type/theme stays highlighted in green and underlined. It does filter through, but the attribute doesn’t seem to be behaving the way I want it to. Could you have a look at it?
I have just tried using fs-cmsfilter-active but unfortunately, it wasn’t successful. I have followed the instructions and double checked it on a video I found on YouTube but still didn’t manage to get the active class to work… do you have any ideas why it may be the case? could it be because of the text style i’ve got applied with hover state?
hey @tinwid! Could you follow this guide on how to set the active class? There are some changes on your setup and I believe watching this video give be a better understanding of how this is setup!
I did adjust it as per video it all worked great! Thank you for that:)
Annoyingly, as with everything, I came across another query in the meantime… My text link ‘clear filters’ is not working properly. I have set it up with the fs-cmsfilter-element with value ‘reset’ but it’s not resetting all filters- it is only resetting the last clicked/chosen filter. The text link is nested inside the form element, with an attribute ‘fs-cmsfilter-element’ with value ‘filters’.
Any thoughts what may be going wrongly there? It is still the same page as before.
Thank you so so much for all of your assistance so far- cannot appreciate it enough!
