Free Webflow CMS Sliders powered by Swiper JS

We've been thru all slider libraries with more than 100+ sites in the past, and in the end decided that the Swiper Library works best for our use-cases.

We've upgraded our sliders and moved them to a new site - Boujee Sliders.

The most powerful CMS Slider for Webflow

Adding scripts

JS Script CDN:
<script src="https://flow-ninja-assets.s3.amazonaws.com/ninja-script/core.min.js"></script>
Copy to Clipboard
CSS Style CDN:
<link rel="stylesheet" href=”example.css">
Copy to Clipboard
Even though Webflow has its own slider component, using it with CMS can be really tricky. That's why each project we work on at the agency, is using SwiperJS.

Basic Slider

This is how each project is usually started. A simple SwiperJS slider, showcasing 4 cards, you could replicate this functionality with Webflow native slider, but using Swiper will give you a better mobile experience + a smoother scroll thru cards.

Thumbnail Slider

Probably the Webflow dev's nightmare. We've pulled some gray hairs untill we've discovered this functionalitly.

Infinite Loop Slider

The standard SaaS website package, just connect to the CMS and add logos! 

Auto Height

Avoid wierd looking slides, by adding an Auto Height functionality.

Pop Up

Clients can sometimes go crazy with requests. And Z index can also behave really funny at times. That's why this Popup Slider will save your life.

Grid Slider

4x4, 8x8 and more, just add the Grid Functionality!

Vertical Slider

Why keep it simple when you can go vertical.

Swiper Number Pagination

Add simple number pagination to each slide.

Adding Attributes

In this specific example we have two swipers

Main Swiper

"{attr.name}"
"{attr.value}
this will trigger swiper script
ninja-swiper
Copy icon
"
enabled
"
Copy icon
this will trigger swiper script

Thumbnail Swiper

ninja-swiper
Copy icon
"
enabled
"
Copy icon
this will trigger swiper script

Optional Attributes

ninja-swiper
Copy icon
"
enabled
"
Copy icon
this will trigger swiper script

New sliders available at Boujee Sliders

We created new and upgraded Webflow sliders called Boujee Sliders. Check them out!

Explore Boujee Sliders

8 Completely free CMS-powered sliders

Additionally, you won't have duplicate content on your page, as you're connecting the Swiper library directly to your Webflow CMS collection.

See Featured Example

Featured Example

Frequently Asked Questions

No items found.

Get a free webinar and subscribe to our newsletter

Maximize marketing ROI by learning how we cut development costs by up to 30% and propel growth with Webflow, design, and automation.

Free Webinar
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Growing a Webflow project is hard. We make it easy.

Grow my project
Mihajlo Djokic Business Development Manager At Flow Ninja
Uros Mikic CEO of Flow Ninja

Schedule a call and get 3 free tips for your Webflow project

#091030