Amelia - Post slider options
The free version of Kadence doesn't include a post slider, so we built a custom slider! 🙌🏻 In this tutorial, we'll show you how to modify the slider settings.
Amelia includes two slider styles:
- Full-Width Slider (see it here)
- Left Image Slider (see it here)
Slider options in the block editor
First, please note that the slider will not run within the block editor. This is normal! In the block editor, you'll see a Posts block in place of the slider, and the slider will run on the front end.
The custom post slider in the Amelia theme uses the Posts block as its base, so all of the options available in the Posts block are available for you to change! Through the Posts block settings, you can do things like:
- Select a new image size
- Change the number of posts in the slider
- Choose which posts display (learn more)
- Enable/disable post date
- Enable/disable post category
- Enable/disable post excerpt
- Enable/disable read more button
Slider options in the slider JS file
NOTE: The rest of this tutorial is considered intermediate-level and involves light code editing. Please proceed with caution.
To access the slider JS file, go to Appearance > Theme File Editor > js > amelia-slider.js. We recommend creating a backup of this file before making any changes.
Available Settings
Here are the settings in this file that you can modify:
- speed: Speed at which a new slide transitions in. Default is 2000 (2 seconds); can be changed to any positive number.
- autoplay: Determines if slider moves to next slide automatically or not. Default is true; can be changed to false to disable autoplay.
- autoplaySpeed: Speed at which the slider moves to the next slide. Default is 4500 (4.5 seconds); can be changed to any positive number.
- dots: Show or hide navigation dots below the slider. Default is true; can be changed to false to disable dots.
- arrows: Show or hide navigation arrows. Default is false; can be changed to false to enable arrows.
Note: We do not recommend changing any other settings beyond what is listed above.
Left Image Slider
By default, the Left Image Slider displays image on the left and title/excerpt on the right. Prefer to swap it so image is on the right? Delete your existing slider, then open up the Design Library. Look for Post Slider - Right Image and add it to your page.