Finsweet cms filter for blog

Hey helpers,

I wanted to filter my CMS blog in a cool way and took some bits and pieces from a Finsweet example for using a form and radio buttons to filter my posts. It works for the most part but I’m having challenges with 2 things:

  • For my “All Posts” button, it works but I want the dark background to stick when its pressed, its not a radio button like the others because the “reset” function won’t work on that :frowning: I found a similar issue which was solved on this post from February but the same fix doesn’t work for me :frowning:

  • I would love for the text on the left to be displayed interactively with the relevant buttons that are pushed for the filters (All posts, typography etc.) How on earth does one do that?

Finsweet cms filter guide is here

Read only link to the project is here

Thanks!
Adam

Hi Adam, I think for you case is better to use a separated CMS collections instead FInsweet filter buttons.

If you have a separated CMS pages for each tag — you may easy change a title, SEO Settings (set canonical links), also users may easy share a direct URL link to your filtered page, instead that you have on your current version of filter by themes.

UPD Also, CMS collection have a limitation of 100 items per collection, and in the future when you will have a more than 100 Blog posts it may be a problem for filter working… But with separated CMS collections you just add a pagination feature and all pages will be available for users.

Hey Adam,

I cannot remember the solution for the “All posts” button off the top of my head, it was either custom CSS or custom JS. You should be able to find what you need in Finsweet’s own forums. One of my comms with their support team there was on this topic.

Javascript. You’d need to capture a filter-change event, determine the filter state, and update the text you want. Check the API page for FS Filter, they show some of the call formations there. Others are hidden on the Core page or in the github repos, I remember having to dig quite a bit for certain api details.

Adding 2 notes on Dmitrii’s excellent suggestions;

As Dmitrii suggested, always take advantage of collection pages for the SEO benefit whenever you can. However the separate Filter UX is probably more user-friendly for quick results, depending on your content and user profile. You can do both.

Dmitrii- check out Finsweet’s CMS Load. It works in combination with FS CMS Filter, and I regularly build filtered result sets of 2,000 items+. They work fabulously together. However as you pointed out, script-loaded content isn’t the best SEO strategy so leverage the collection pages as well.

Yeah, I know it, just thought not to go so deep and offer the simplest solution from the point of view of implementation and SEO😌

Hey everyone! Thanks so much for the fast reply and great advice! I never considered that separated CMS approach, I’m think I know what you mean, I’m going to give it a shot and see if I can make it work. As I theorise it in my head, I can’t think how I’ll do the “All posts” page… but I’ll cross that bridge when I get to it!

I’ll check out the Finsweet CMS load and CMS Filter also, still consider myself new to this Webflow game, everything takes me weeks and I’m running around like a headless chicken, learning curve indeed :laughing:

Thanks again!
Adam