How do I create a slider with photos (or video)?

Step 1: Add the Image slider block

Click on the plus sign in a column, search for slider, and choose Image slider (“Create a slider from images”).

Step 2: Add slides

Click on the button to add a row under Slides. Choose the photo under Image. Repeat this for each slide. You can change the order by dragging the rows.

A video in a slide

Enable Show video for a slide and paste the link of a YouTube or Vimeo video under Video. The chosen photo will then be the thumbnail for the video. Your visitor will see the photo with a dark overlay and a play button. Only after a click will the video appear and start playing. Therefore, always choose a photo for a video slide as well.

Step 3: Choose the Image size

Under Image size, choose which version of the photos the slider will use. If the slider shows multiple photos side by side, then Medium large or Large is sufficient. For one large photo per slide, choose Full size, with photos up to 1920 pixels wide.

Step 4: Set up the slider

In Slider settings, you determine how the slider behaves. There are two tabs: General + desktop devices and Mobile devices. The main options are:

• Items in slider: how many photos are visible at the same time (default 4). A value like 1.5 will show half of the next photo.
• Automatic sliding and Automatically slide after X seconds (default 5).
• Infinite slider: after the last photo, the first one comes back.
• Show previous and next buttons and their position under Previous and next buttons location.

All options are explained in setting up a slider.

Slider or gallery?

• Do you want the visitor to see everything at a glance and view photos in large size? Choose the Gallery.
• Do you want to use little space, show photos one after another, or include a video? Choose the Image slider.
• To place a standalone video without a slider, use the block Video, see placing a video from YouTube or Vimeo.
• You can also create a moving row of logos with the slider, see a row of logos from customers or partners.

Do you want to show the difference between two photos? Then the before-and-after slider is the right block.

Having trouble?

• A video slide only shows the photo. That’s correct until you click: the video starts only after a click. If it still shows nothing after a click, check the link under Video.
• A video slide is empty. Also choose an Image for that slide: the video uses the photo as a thumbnail.
• Photos are cropped oddly. Use photos with the same aspect ratio.
• I don’t see any arrows. Turn on Show previous and next buttons, and for phones, also the mobile variant.
• On mobile, there are too many photos next to each other. Set that in the tab Mobile devices under Items in mobile slider.

Can’t figure it out? Contact us.