Slide

Setting Description
Color scheme

Choose the right color scheme from the list for image slide block.

Applying a color scheme to the slide block automatically updates all associated colors set in the theme settings according to the created color schemes.

Background image Choose a background image for your slideshow. Click on “Select Image” to access your media library, upload a new image, or explore free images. Also, you can connect a dynamic source by clicking the source button. Once an image is added, you can use the “Change” button to remove, replace, or delete it.
Background image mobile You can use a landscape image for desktop and a square or portrait image for mobile. This allows you to add a background image with the appropriate ratio for each device, ensuring optimal display.
Overlay The “Overlay” setting allows you to adjust the transparency of the overlay that is applied to image on your website. Use the slider to make changes.
Heading

To add a heading to the image slide, simply enter the text in the provided field. In the top menu of the field, you can find options to customize the heading such as making it bold, italic, or adding a hyperlink. 

Furthermore, you can click the dynamic source button to insert a dynamic source as the title of the section.
Heading size

The heading size setting offers three options to control the heading size of each slide:

  • Small
  • Medium
  • Large
Subheading Include a subheading for image slide after heading and customize its appearance using the rich text field.
Button label

Decide whether the section includes a button:

  • To display the button, enter text into the field as the label.
  • To hide the button, leave the text field empty.
Button link (paste a link or search) Input the URL you want the button to direct to, or select a page from the dropdown list of options that appears when you click on the field. Also, you can click the source button to add a dynamic source as a URL.
Use outline button style Enable this option to apply an outline style to buttons. This style features a border around the button with a transparent background.

Layout


Setting Description
Desktop content position

Customize the position of content on desktop screens:

  • Top: Align content at the top of the section. Options: Left, Center, or Right.
  • Middle: Align content at the center of the section. Options: Left, Center, or Right.
  • Bottom: Align content at the bottom of the section. Options: Left, Center, or Right.
Show container on desktop Enable the button to add the content into a container with a background color. Disable the button if you want all content displayed on the image banner.
Desktop content alignment

You have three alignment options to align content horizontally on desktop (heading, description, and button) :

  • Left
  • Right
  • Center

Mobile layout 


Setting Description
Mobile content alignment

Choose the horizontal alignment of the content on mobile:

  • Left
  • Center
  • Right

Hotspot


Setting Description
Product 1 Select product 1 for hotspot product item, and it will be shown in the card.
Horizontal position

Set up the position of hotspot 1 on the image. 

By adjusting the horizontal position, you can move the hotspot left or right on the image, aligning it to the desired location horizontally.
Vertical position Similarly, by modifying the vertical position, you can move the hotspot up or down on the image, positioning it at the desired location vertically.
Bubble position Change the bubble position on hover for hotspot item 1:  top, bottom, left, right.


Product 2 Select product 2 for hotspot product item, and it will be shown in the card.
Horizontal position

Set up the position of hotspot 2 on the image. 

By adjusting the horizontal position, you can move the hotspot left or right on the image, aligning it to the desired location horizontally.
Vertical position Similarly, by modifying the vertical position, you can move the hotspot up or down on the image, positioning it at the desired location vertically.
Bubble position Change the bubble position on hover for hotspot item 2:  top, bottom, left, right.


Product 3 Select product 3 for hotspot product item, and it will be shown in the card.
Horizontal position

Set up the position of hotspot 3 on the image. 

By adjusting the horizontal position, you can move the hotspot left or right on the image, aligning it to the desired location horizontally.
Vertical position Similarly, by modifying the vertical position, you can move the hotspot up or down on the image, positioning it at the desired location vertically.
Bubble position Change the bubble position on hover for hotspot item 3:  top, bottom, left, right.

Example of Image slide with Hotspot items

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us