How can I apply the is-active class to my Webflow View-all radio button using FinSweet's attributes method for filtering a CMS of blog posts?

To apply the is-active class to a "View All" radio button when using FinSweet’s Attributes for CMS filtering, you need to set up the attribute correctly and ensure the active class is applied when no specific filter is selected.

1. Set Up Your Filtering Structure in Webflow

• Add all your filter buttons, including the “View All” option, inside a wrapper (fs-cmsfilter-controls).
• Each button (radio/toggle) should have the fs-cmsfilter-field and fs-cmsfilter-active attributes.
• Use the fs-cmsfilter-active-class="is-active" attribute on the wrapper or individual buttons to define the active styling class.

2. Assign the Correct Attributes to "View All"

• To make “View All” act like a reset filter and get the is-active class when active:
• Set fs-cmsfilter-field="category" (or whatever your filter field is).
• Set fs-cmsfilter-value="" (an empty value indicating no filter).
• Ensure it's grouped with the other filter inputs.

Example:

• View All radio button:
• fs-cmsfilter-field="category"
• fs-cmsfilter-value=""
• Optional for visuals: fs-cmsfilter-active

3. Add the Active Class Behavior

• On the parent wrapper or button group, include:
• fs-cmsfilter-active-class="is-active"
• FinSweet will automatically apply the is-active class to whichever button matches the current filter selection—including “View All” when no filter is applied.

4. Default to “View All” on Page Load

• To default “View All” as selected on first load:
• Set the default filter value in FinSweet’s JavaScript config (if used), or
• Place “View All” at the top of the filter group so it's triggered first.
• FinSweet’s script will assign the is-active class appropriately on load if no filter is selected.

Summary

Assign fs-cmsfilter-field and an empty fs-cmsfilter-value to your “View All” button. Use fs-cmsfilter-active-class="is-active" on the buttons or group to trigger the class. FinSweet will auto-apply the is-active class to "View All" when no filter is active.