Basic slider

Best for simple sliders with pagination. Supercharge your CMS collections with Sliders.

Our team

All hands on deck agile three-martini lunch quick win both the angel on my left shoulder and the devil on my right are eager.

Personal image of a member from Flow Ninja
Uros Mikic

CEO, Webflow Expert

Twitter Logo LinkLinked In Link
Personal image of a member from Flow Ninja
Stefan Mikic

Head of Development

Twitter Logo LinkLinked In Link
Personal image of a member from Flow Ninja
Marko Vukic

Head of Development

Twitter Logo LinkLinked In Link
Personal image of a member from Flow Ninja
Tamara Vitas

Project Manager

Twitter Logo LinkLinked In Link
Personal image of a member from Flow Ninja
Kristina Ivanovic

Head of Design

Twitter Logo LinkLinked In Link
Clone

You are almost there! Clone this template by clicking the link above. Learn, play around, test, use your own content, and have fun.

Paste this before <body> in project settings

<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
<script>
var mySwiper = new Swiper ('#basic-swiper', {
slidesPerView: 4,
 slidesPerGroup: 1,
 spaceBetween: 28,
 grabCursor:true,
 allowTouchMove: true,
 navigation: {
 nextEl: '#right-button',
 prevEl: '#left-button',
},
    breakpoints: {
     0: { /* when window >=0px - webflow mobile landscape/portriat */
         slidesPerView: 1.2,
        slidesPerGroup:1,
       spaceBetween: 28,
     },
         480: { /* when window >=0px - webflow mobile landscape/portriat */
         slidesPerView: 1.5,
        slidesPerGroup:1,
       spaceBetween: 28,
     },
     767: { /* when window >= 767px - webflow tablet */
           slidesPerView: 3.2,
        slidesPerGroup:1,
       spaceBetween: 28,
     },
     992: { /* when window >= 988px - webflow desktop */
        slidesPerView: 4,
        slidesPerGroup:1,
       spaceBetween: 28,
     }
   },
     });
</script>