How to Create a Vertical Slideshow in MetaSlider

We had a request from a MetaSlider user this week. They wanted to build a vertical slideshow with the slides moving up-and-down instead of left-to-right. They also wanted the navigation features to be displayed vertically.

It is possible to create a vertical slideshow with MetaSlider and we’ll show you how this is done.

How to Build a Vertical Slideshow

To follow along with this example, start with a basic slideshow with several images. You can use the free version of MetaSlider for this task.

• Make sure you’re using the “FlexSlider” option for your slideshow.
• Click “Select a custom theme” in the sidebar.
• Choose the “Jenga” theme. Click here to see all the themes available in MetaSlider.

Choosing the “Jenga” theme will move the navigation for your slideshow to the right side of the screen. You can see the vertical dots in this screenshot below. There are also left and right arrows for the navigation.

The next step is to get the slides moving vertically.

• In your slideshow settings, choose “Slide” for the “Effect” option.

• Go to “Advanced Settings” and choose “Vertical” for the “Slide direction” option.
• I will also recommend increasing “Animation speed” so the slides arrive and leave a little more slowly and you can test the vertical sliding.

Once you’ve made these changes, your slides will enter vertically from the bottom of the slideshow. In the screenshot below, the image of the airplane is entering from below and replacing the previous image.