How to Use Electro Slideshow

In this article, we will show you how to use Electro Slideshow effectively to create a pretty banner, which helps to boost sales and conversion rate.

About Electro SlideshowClick to copy 2222

OverviewClick to copy 2222

How many images can I add to Electro Slideshow? Up to 5
What are the recommended sizes for defaulted background image 2880x1200px
What is the recommended size for mobile background images? 750x1400px
What is the Moving Speed Mode? 3 to 10 seconds
Type of Images I could add? PNG, JPG and GIF

What is Electro Slideshow?Click to copy 2222

The slideshow section offers the capability to present a series of banners within a single designated section, providing an engaging and dynamic visual display.

What is Electro Slideshow?

Electro Slideshow Section ConfigurationsClick to copy 2222

There are 5 tabs to settings for this section: General, Layout, Controller, Content and Accessibility.

GeneralClick to copy 2222

To adjust the Overlay opacity, slide the percentage bar in the Overlay settings to the desired opacity:

  • The overlay opacity will be applied to the section and background image list. Therefore, it highlights the content inside the section.
  • You can adjust the overlay range from 0% to 90%.

If you want to change the color scheme, you can switch to a different color scheme. This color scheme is set up in the theme settings.

After that, you can enable large heading if you use the slideshow as a hero section.

When turning this on, all heading in the Slideshow section will have the headline’s font size.

LayoutClick to copy 2222

The section has 3 options to show based on your need, which is reflected in the Height dropdown selector:

  • 70% screen height
  • 100% screen height

By default, the banner section will be set at 70% screen height for highest quality.

Please note that this height will always set to 100% on mobile.

You can adjust position for the content of the section area, which can be changed at Content Position dropdown selector:

  • Top left
  • Top center
  • Middle left
  • Middle center
  • Bottom left
  • Bottom center

ControllerClick to copy 2222

You can select to show pagination number, navigation or enable autoplay for the slideshow. These options are enabled by default.

The waiting time before autoplay can be set by dragging the Change Slides Every bar below. The autoplay delay time on each time is set at 5 seconds; however you can change it from 3 to 10 seconds at Autoplay Delay slider to match with content on your slides. Make sure to consider text content and images in each slide to give an appropriate time for customers to consume all the important details without pausing. It’s recommended not to show too many slides in a short time to maintain customer experience in browsing.

AccessibilityClick to copy 2222

In Accessibility, you can click on the placeholder to change the Slideshow description.

Slide ConfigurationClick to copy 2222

Please note that you are free to add a maximum of 5 slides in this section.

To adjust for the slide, click on the block and go to the Settings. After that, Block Slide

To adjust for each slide, click on the slide and go to the Settings. You can change the content in the slide in the Text tab with Subheading, Heading and Description.

In the Image card, click on the Select image button to upload the background image and mobile background image. The recommended size is 2880x1200px for background image and 750x1400px for mobile background image.

You can set background images separately for large screens and mobile. If you set the background image for the large screen and don’t upload the image for mobile screen, the mobile view will automatically inherit the image of the large screen. If you set the background image only for the mobile screen, the large screen will not inherit the image of the mobile screen.

In the Buttons card, insert the button label name for the Primary and Secondary button to add buttons on the section. Click on the button link to add a direct link for them. If you want to remove one button, just delete the text in the button label.

Frequently Asked QuestionsClick to copy 2222

What is an ‘Electro Slideshow’?Click to copy 2222

The Electro Slideshow Section allows sellers to display multiple banners within one image section. This is a great way to show your product features or brand images effectively.

Difference between an ‘Electro Slideshow’ and a ‘Moving Image Banner’?Click to copy 2222

Using the Electro Slideshow to show an image slideshow with the timer set by sellers, the image will be displayed in Full ratio, 1 to 1 continuously. For the slideshow, sellers can edit content and CTA buttons for each slide, with more customized image sizes for background (laptop) and mobile visuals.

What is the similarity between ‘Electro Slideshow’ and ‘Moving Image Banner’?Click to copy 2222

With both types of banner sections, you can add up to 5 images from the current library or to update new photos from your laptop. Both of them have choices of color schemes with opacity option, to make sure the image section is suitable for the page.

Navigate this category