Add and customize beautiful and dynamic galleries to your pages using the Image Carousel widget in the 10Web Builder.
The Content Tab
Click on the image box or the + icon to upload files and select images. Click on Create New Gallery > Insert Gallery.
Image Size: Click on the drop down menu to set the size of your images.
Slides to Show: Set the number of images displayed on the carousel.
Slides to Scroll: Set the number of images scrolled at one time.
Image Stretch: Option to stretch images to the entire block.
Navigation: Set the navigation icon look.
Link: Option to set a link to the images.
Media File: Allows the image to be displayed in a lightbox. The link redirects to the image’s media file.
Custom URL: Set the images to redirect to your landing page.
Caption: Option to show caption, title, description, or none.
Autoplay: Option to scroll the carousell automatically.
Pause on Hover: Option to pause the scrolling on hover.
Pause on Interaction: Option to pause scrolling upon interaction.
Autoplay Speed: Set the time interval between each transition.
Infinite Loop: Option to set the carousel in an infinite loop of scrolling.
Animation Speed: Set how fast an image transitions to the next.
Direction: Set the direction of the scroll.
The Style Tab
Position: Choose the placement of the arrows to be inside or outside the slider.
Size: Adjust the size of the arrows.
Color: Customize the color of the arrows.
Position: Choose the placement of the dots to be inside or outside the slider.
Size: Adjust the size of the dots.
Color: Customize the color of the dots.
Vertical Align: Align the image to the top, middle, or bottom.
Spacing: Option to customize spacing between images.
Border Type: Option to set a border to the images.
Width: Shows when a border is chosen. Set the thickness of the border.
Color: Shows when a border is chosen. Customize the color of the border.
Border Radius: Adjust the radius of the border for rounded edges.
Alignment: Set the alignment of the caption relative to its image.
Text Color: Customize the color of the text.
Typography: Customize the typographical settings of the text.
The Advanced Tab
In the advanced tab adjust the padding, apply Z-index to your elements, set conditions, motion effects, responsiveness, and more.
Next Up: Icon List