In this tutorial, you will learn how to create an awesome custom slider, with Elementor.
Here is what we will be creating:
Here is what it looks like on mobile:
You can also visit the demo page directly.
Credits: I got the design idea here.
- Amazing: get a truly original slider and impress your visitors or clients
- Fully responsive: the layout is responsive and works well on tablet and mobile too
- Easy to replicate: simply copy paste the template
- Make it your own: swap to your content, edit the CSS to customize the fonts and colors easily
Also note that the slider is entirely custom (i.e. it's not using any JS slider library), and as such has a limitation: you can't swipe to navigate through the slides. You have to click the arrows, or click on one of the cards.
Another limitation is that it's not dynamic. It can't come from a custom post type. The slides' content is static. It could come from an ACF options page (or equivalent) though.
The Container feature needs to be activated for this tutorial to work.
Let's get started!