Slider

Note: This article applies to Free Trial accounts created on or after 16 December 2024 and Website, Website+Marketing and eCommerce packages created on or after 18 December 2024. If your accounts were created before these dates, please refer to the article Elements Management.

Adding Slider

Option 1

  • Hover over the desired section, and click the Add Element:

  • Choose the Slider element from the modal that appears:

  • After you choose the element from the list, drag it to the desired section and drop using the grid.

Option 2

  • Hover over the left sidebar of the Site Editor and click Build (+) button:

  • Choose the element:

  • After you choose the element from the list, drag it to the desired section and drop it using the grid.

Moving and Resizing the Slider

Please refer to the Elements Management (New Grid) article to learn more about moving and duplicating elements.

Customizing a Slider

To edit, add item, delete item, manage background, duplicate, or delete the element, click on it and switch between the buttons that appear in its toolbar:


Editing the Slider

Click the Slider, and click the Edit button to modify its Settings and Navigation:

Settings Tab

  • Loop Slides: Select to loop the slides for the autoplay. The slideshow will keep replaying until the visitor stops it.
  • Autoplay: Drag the Autoplay timing control to set the transition time between slides (in seconds). The autoplay stops whenever a visitor hovers over a slider. When the cursor is removed, the autoplay resumes.
  • Align Vertically: Select the Align Vertically control to place the elements into the center of the slider.
  • Slider Effect: Choose between Smooth, Bouncy, Overshoot:

Navigation Tab

  • Theme: Select a dark or light theme for displaying slider arrows and bullets.
  • Show Dots: Display or hide the slide indicators.
  • Dots Position: Switch between Bottom and Top dots position.
  • Show Arrows: Select the arrows position: Default, Left, or Right. Deselect the control to hide arrows from the slider.

Adding Item to the Slider

  • Click + in the toolbar to add a new slide:

Please Note: The number of dots at the Slider's top or bottom corresponds to the number of slides.

Removing Item from the Slider

  • Click - in the toolbar to delete a slide:

Managing the Slider Background

  • Click the Background button on the toolbar to set up the background of your Slider.
  • Select Add Photo, Video, or Map:

  • Adjust the Opacity and change the Background Color.

Duplicating the Slider

  • To duplicate the slider, click on the element and choose the Duplicate button that appears in its toolbar:

  • The duplicate of the element will appear immediately.

Deleting the Slider

  • To delete the slider, click on the element and choose the Remove button [Bin] that appears in its toolbar:

  • The element will be removed immediately.