Slideshow

Live Chat Support | Webibazaar Template

The slideshow allows multiple slides to display with images and optional text. This section allows you to add a slideshow in full width or grid. There are many options available similar to the slideshow, as you can see in the below screenshot:

Recommendation Size Slideshow image desktop size: 1920x540 Slideshow image mobile size: 767x700

You can add a slideshow section to display a carousel of images on a page in your store.

Setting	Description
Layout	Customization of the "Layout" in the Slideshow section is as follows: Wide Container
Enable center slide	Enable this checkbox to show center slide of this section.
Slide height	Customization of the "Slide height" in the Slideshow section is as follows: Adapt to first image Small Medium Large
Carousel	Transition effect Customization of the "Transition effect" in the Slideshow section is as follows: Slide Cards Coverflow Enable loop Enabling loop will result in the slides continuously looping. Enable autoplay Enable this checkbox to automatically rotate the images in the slideshow. Autoplay interval Use the bar to set the auto-rotate time of the slideshow. You can set a minimum of “3” seconds and a maximum of “9” seconds.
Navigation	Enable arrows Enable this checkbox to show slider arrow in this section. Disable arrows in mobile Enable this checkbox to hide slider arrow in mobile view of this section. Background color You can customize the background color of the navigation by using the color option. Foreground color You can customize the foreground color of the navigation by using the color option.
Pagination	Position Customization of the "Position" in the Slideshow section is as follows: Over the image Below the image Style Customization of the "Style" in the Slideshow section is as follows: None Dots Bars Counter Numbers Background color You can customize the background color of the Pagination by using the color option. Foreground color You can customize the foreground color of the Pagination by using the color option.
Animations	Customization of the "Image behavior" in the Slideshow section is as follows: None Ambient movement By employing the Ambient movement feature, the slider images will exhibit motion.
Mobile layout	By enabling this checkbox, you can view the slide content below the image in a mobile device.
Accessibility	Describe the slideshow for customers using screen readers.

Add Slide

To add slides to the slideshow section, click on the 'Add Slide'. There are many options available similar to the slideshow, as you can see in the below points and screenshot:

Block	Description
Slide	Image Use "Image" to add the image to the slide. Mobile image Use "Mobile image" to add the mobile image to the section. this is optional because it will take desktop image when mobile image will not be added.
Subheading	Text Enter the text you would like to display as a sunheading before the slide's heading. Size Customization of the "Subheading size" in the slide is as follows: Small Medium Large
Heading	Text Enter text to display as a title in the slide. Size Customization of the "Heading size" in the slide is as follows: Small Medium Large Show border below the heading Enable this checkbox to show border below the slide heading of this slide.
Description	Text Enter the text you would like to display as a description of the slide. Size Customization of the "Description text size" in the slide is as follows: Small Medium Large
Button	Label Use "Label" to add a label to the Button in the slide. Show arrow Enable this checkbox to show arrow in button slide of this slide. Link Use "Button link" to add a link to the Button in the slide. Style Customization of the "Button style" in the slide is as follows: Link Outline button Solid button
Desktop content position	To change the position of the content on the slide, utilize the "Desktop content position" setting. Customization of the "Desktop content position" in the slide is as follows: Top left Top center Top right Middle left Middle center Middle right Bottom left Bottom center Bottom right
Desktop content alignment	Customization of "Desktop content alignment" in desktop devices is as follows: Left Center Right
Color scheme	In this section, you have the option to modify the background and foreground colors of a slide's content container using the provided color scheme. Scheme 1 Scheme 2 Scheme 3 Scheme 4 Scheme 5
Mobile layout	Mobile content alignment Customization of "Mobile content alignment" in mobile devices is as follows: Left Center Right Content position on bottom Enable this checkbox to show the slide content below the image in mobile view.