Splide.js Carousel Webflow cloneable

About cloneable

This Webflow cloneable offers a comprehensive solution for creating custom sliders using Splide.js. With four unique carousel sliders included, users can enhance their website with dynamic and interactive slide displays. From intelligent control buttons to slide counter navigation and infinite looping capabilities, this cloneable provides a versatile range of options to showcase content effectively. By leveraging Splide.js, users can enjoy a lightweight and mobile-friendly slider solution that goes beyond Webflow's native capabilities. With the ability to adjust settings like items per page, slide transition speed, and pagination, users can create engaging slider experiences tailored to their specific needs. Perfect for those looking to elevate their website with visually striking and efficient slider functionalities.

This code snippet includes the Splide.js library and initializes two separate sliders, each with different configurations for responsive breakpoints and slider settings. The first slider (slider1) displays 3 items per slide on desktop, 2 items on tablet, and 1 item on mobile. The second slider (slider2) displays 5 items per slide on desktop, 3 items on tablet, and 1 item on mobile. Both sliders have specific settings for speed, navigation arrows, pagination, and gap between items.

About custom code

This code snippet includes the Splide.js library and initializes two separate sliders, each with different configurations for responsive breakpoints and slider settings. The first slider (slider1) displays 3 items per slide on desktop, 2 items on tablet, and 1 item on mobile. The second slider (slider2) displays 5 items per slide on desktop, 3 items on tablet, and 1 item on mobile. Both sliders have specific settings for speed, navigation arrows, pagination, and gap between items.