Your Finsweet Filter checkbox isn’t working, while search and count display correctly. This issue is often caused by incorrect setup of checkbox attributes or JS initialization.
1. Verify Checkbox Structure & Attributes
- Each checkbox input must have the
fs-cmsfilter-field attribute set to the correct field name from the CMS collection. - Example: If filtering based on a CMS field called
category, the checkbox should have fs-cmsfilter-field="category". - Ensure your checkboxes are inside a valid Checkbox Group with
fs-cmsfilter-type="checkbox" assigned. - Confirm each individual checkbox and its label are created using Webflow’s native checkbox element (not custom elements or divs).
2. Ensure Matching Filter Values
- The value of each checkbox must match exactly the CMS field value (including case and spacing).
- For example, if a CMS item has the category “Web Design”, the checkbox must have
value="Web Design".
3. Check for Custom Attributes Consistency
- The collection list item (the element repeating items) must have attribute
fs-cmsfilter-element="item". - The element containing the filters (like the checkbox block) should have
fs-cmsfilter-element="filters".
4. Confirm Finsweet Initialization
- Make sure your page includes the correct CMS Filter script from Finsweet's CDN.
- Check that JS is properly initialized with
fs-cmsfilter and not being blocked by any script errors.
5. Use Unique Field Names for Multi-Factor Filters
- If you're using multiple filter types (e.g., search + checkbox + dropdown), ensure each has a unique
fs-cmsfilter-field name to avoid conflicts.
6. Inspect for JavaScript Conflicts
- Check your browser developer console (Chrome Dev Tools) for any JS errors that may interfere with Finsweet.
- Conflicting scripts or incorrectly formatted attributes may silently break the checkbox function.
7. Rebuild One Working Filter as a Test
- As a last resort, create a simple test filter on a new page:
- One checkbox group filtering by category
- A collection list of items with the category displayed
- If this test works, gradually integrate the working pattern into your full page setup.
Summary
To fix your Finsweet Filter checkbox, ensure checkboxes have the correct fs-cmsfilter-field, values exactly match CMS data, the DOM structure uses proper attributes, and the Finsweet script is correctly initialized. Rebuild a minimal working version to isolate if needed.