[Splide] How to customize pagination of Splide slider

splide pagination customize

There may be times when you want to customize the pagination of a Splide slider.In this article, we will describe how to change the color, position, size, and image of pagination, as well as adding numbers to dots, using fraction notation, or converting it into a progress bar. Create a regular Splide slider For clarity, […]

[Splide] How to customize arrows

splide arrow customize

There may be times when you want to change the color, size, position, or image of the arrows on a slider created with Splide.js. We will explain the customization methods for the arrows in such cases. Create a regular Splide slider For clarity, let’s start by creating a regular Splide slider and then proceed to […]

[Splide] How to replace the arrows with images

slider arrow customize

There may be times when you want to replace the arrows of a Splide slider with custom images.We will explain in detail three methods for replacing them using HTML, CSS, and SVG paths. Create a regular Splide slider For clarity, let’s start by creating a regular Splide slider and then proceed to make modifications from […]

Make the most of the Autoplay option in Splide.js

splide autoplay

The Autoplay option in Splide.js makes it easy to not only make a slider autoplay, but also to display a progress bar, show play/stop button, and make only certain slides appear longer. This article will provide a detailed explanation of the Autoplay option in Splide.js. Create a regular Splide slider For clarity, let’s start by […]

Load Splide.js from CDN

splide cdn

Here is the CDN of Splide.js to create and style Splide slider.As you use CDN, you can create Splide slider without downloading libraries. The above are latest version at this point (February 2024).You can always check the latest version of Splide.js here.https://www.jsdelivr.com/package/npm/@splidejs/splide?path=dist Here is the specific instruction for creating a slider using Splide.js.[Splide] How to […]

[Splide] How to create a simple slider with Splide.js

splide slider

It seems that Splide.js currently boasts three times the hits of the popular slider library, Swiper.js.In this article, we will describe how to create a simple slider using Splide.js. ①Load required libraries from CDN Here, we are using the latest version, ver4, as of February 2024.You can always check the latest version of Splide.js here.https://www.jsdelivr.com/package/npm/@splidejs/splide?path=dist […]