CMS collection template / collection list filtering breaks swiper.js


Using a CMS collection template and a collection list, using the built in filter to only select CMS items (excluding the current one) into a collection list that is running swiper.js - this breaks the swiper carousel.

The only thing I can think off is the swiper.js is being initalized before the filtering.

Is there are callback when the filtering is complete?

please see fault example: SVR Lifestyle | Wimbledon Conservatory

When I don’t use the built in filter the carousel works perfectly see bottom of this page: https://svr-lifestyle.webflow.io/

Any help please :slight_smile:

I’m assuming you’re referring to Webflow’s filtering? That occurs server side. The collection list HTML only renders the items defined by your filter.

Check to make sure you have enough items- if you’re doing e.g. looping with Swiper, there’s an overlap, so depending on the overlap size you set you need a certain minimum number of items for it to function properly.

If you’re talking about something dynamic like Finsweet List Filter, that’s a different story entirely.

1 Like

Thanks it was the not enough items for looping. Thanks :slight_smile:

1 Like