Go to next/previous slides based on clicking the right/left side of the slider

The PRO version of Smart Slider is required for this tutorial!

If you would like the clicking on left half of the slider to lead to the previous slides, while clicking on the right half of the slider to lead to the next slides, follow this tutorial.

Step 1

Create a static overlay, and enter it.

Step 2

In absolute position put down an Area layer.

Step 3

On its Style tab settings use this configuration:

Align: left
Left: 0px
Top: 0px
Width: 50%
Height: 100%

You cannot select % values for width and height, but you can write it down into the fields and they will be used.

Step 4

On the Content tab settings, at Link, choose Actions -> Previous slide.

Step 5

Change the Background Color to be transparent.

Step 6

Do the same for the right side. In that case use Align: right, and Next slide as the link action.

Step 7

You are done, save on the slide and you can click on these area layers to switch between slides!

Extra tip

You can use the CSS field of the Area layers to enter cursor CSS code, if you would like to:

cursor: url(https://example.com/right-arrow.png), auto;