How to Add Dynamic Search & Filtering to Webflow CMS with Jetboost

The video is a tutorial by Connor, founder of the Unicorn Factory, on how to add dynamic search and filtering functionality to a Webflow CMS using a tool called JetBoost. Connor demonstrates the process using his freelancer marketplace websites for New Zealand and Canada.

JetBoost is an add-on specifically designed for Webflow CMS that allows users to implement features like dynamic search, filtering, favoriting, and auto-archiving. The tutorial focuses on setting up search functionality and dynamic list filtering for a freelancer directory.

Connor walks through the steps to set up the search feature, including:

1. Connecting JetBoost to the Webflow account
2. Selecting the desired fields to search (e.g., job title, primary service, subservices)
3. Embedding the necessary code in the Webflow project
4. Creating and styling the search input field

For the filtering functionality, Connor demonstrates:

1. Setting up dynamic list filtering in JetBoost
2. Choosing the field to filter by (in this case, freelancer type)
3. Adding the required class names to the Webflow collection list
4. Creating a select dropdown for filtering options

Throughout the tutorial, Connor emphasizes the importance of publishing changes in Webflow and testing the functionality on the Webflow.io domain before publishing the filters.

Highlights:

• JetBoost simplifies the process of adding dynamic search and filtering to Webflow CMS projects
• The setup process involves both JetBoost configuration and Webflow implementation
• The tutorial demonstrates how to create search and filtering functionality in about an hour