Skip to main content
Sliders
Updated over 8 months ago

Carousels and Slideshows can be added through the structure panel by navigating to Elements and then dragging the Carousel or Slideshow component from the Interactive group onto the canvas.

A “Slider” group will be visible within the layers panel; this group contains the “Slides” and “Navigation” groups. The Slides group contains the slides and the Navigation group has the next and previous buttons.

Changing Slider settings

Layout

You can change the layout by selecting the Slides group. Here you can set:

  1. (vertical) alignment of the slides

  2. snapping behavior, which is responsible for horizontal alignment of the slides

  3. gap between slides

  4. slide size, where you can also pick the number of slides per view

Animation

You can change the animation by selecting the Slides group. Here you can set:

  1. speed of the animation, which is the speed of the transition between slides

  2. loop: on/off

  3. autoplay: on/off

  4. delay of the autoplay animation, which defines how long it takes before the next slide is shown

Please note that looping only works when you have a sufficient amount of slides. If you do not have enough slides you can duplicate your slides.

Slide

You can navigate to a Slide by directly selecting it within the layer panel and by selecting it on the canvas. You can also remove and duplicate your slides directly from the layer panel and directly from the canvas.

To add an empty slide right-click on the Slides group and select “Add new slide” from the context menu.

If you have picked to have an automatic slide size, then it is not possible to set a width to your slides. In case you want a different width per slide, select to have a manual slide size, this can be found in the settings of the Slides group.

In case you want to change the space between the slides, this can be done by editing the gap field in the settings of the Slides group.

Adding content to your slides

You can place your content directly within each slide through the layer panel by dragging content into a slide or by dragging it into the canvas within the slide that you wish to design.

Additionally, when you drag content into the Slides group itself, it will automatically be converted into a slide.

Navigation

The navigation group contains the previous and next buttons. By selecting these on the canvas, you can define their position and style these controls to your liking.

You can add a new Navigation group by right-clicking the Slider and selecting “Add slider navigation” from the context menu.

Please note that the buttons only work when they are inside the Slider and when the Slider contains a Slides group. You can add a new Slides group by right-clicking the Slider and selecting “Add slides” from the context menu.

Did this answer your question?