Image Slider

Create a fully responsive and smooth image slideshow of your products, services, or clients.

How To Add The Image Slider Block

  1. Open a page or a post and click on the plus icon to add a new block and look for the Image Slider or you can search for it if it doesn’t pop up quickly for you.

  2. Next, you have to upload images that you want to showcase.

How To Configure The Image Slider Block

To configure the content of your Image Slider block, switch to the ‘Content’ tab.

Size - Select the size of the images displayed in the image slider as Large, Extra Large.

Gutter - Adjust the spacing between the images of the image slider.

Radius - You can set the radius width of the corners of an image.

Custom Width - Turn on to assign custom width to the images of the image slider.

Width in pixels - Adjust the width of the images when the Custom Width setting is turned on.

Heights in Pixels - Adjust the height of the images in the image slider.

Small Images - Toggle to display small sized images in the image slider.

Thumbnails - Toggle to display thumbnail images below the main images in the image slider.

Lightbox - Toggle to enable the image lightbox.

Slider Settings

Slider Settings offer options to customize the image slider. You'll see the below options to enable–

  • Autoplay

  • Draggable

  • Free Scroll

  • Arrow Navigation

  • Dot Navigation

  • Align Cells

How To Style The Image Slider Block

Switch to the ‘Style’ tab to customize the Image Slider block.

Arrow

Color- Select the color of the arrow in the image slider.

Background Color- Select the background color of the arrow in the image slider.

Background Opacity - Adjust the background opacity of the arrow in the image slider.

Background Radius - Adjust the background radius of the arrow in the image slider.

Border

Border Color - Select the border color of the images in the image slider.

Border Style - Select the border style of the images as Solid, Dotted, Dashed.

Border Size - Adjust the border size of the images in the image slider.

Last updated