Slide show
After inserting a block in Live Preview, you can configure the settings
Last updated
After inserting a block in Live Preview, you can configure the settings
Last updated
Total slides in Slide show
Number of slides per view (slides visible at the same time on slider's container)
It allows you to adjust the display style (full, half)
You can set the size of the gap between slides
It allows you to change the slide direction (horizontal, vertical)
There are a huge number of options that you can choose such as Slide, Fade, Cube, Flip, Cards, etc.
The number of slides will be skipped when the slide change transition
Slide change transition automatically
Slide delay (second): the slide will be delayed for a number of seconds until transition
Duration of transition between slides (in second)
You can change the status to enable/disable continuous loop mode
The position of the button (Middle, Top left, Top center, Top right, etc.)
It allows you to change the color of the button icon
It allows you to change the size of the button in PX
It allows you to change the shape of the button (Circle, Square)
It allows you to change the background color of the button
It allows you to change the background color of the button
Solid: Applies a single color uniformly within the whole of an object by selecting the Background color
Gradient: It applies a continuous blend of two or more colors, where one color gradually fades and changes into another. You can choose the Gradient Style:
Linear: Change the angle of the gradient
Radial: Change the positioning (right center, left top, left center, etc)
First color & first color location
Second color & second color location
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
Inner Spacing (Padding): Padding is inside the border (or edge) of your element. Increasing the padding will “push” your content into the middle of your box, away from your borders. If you remove the padding, your content will take up the entire box
Outer Spacing (Margin): Margin is on the outside of the border of your element. If you increase the margin, it will increase the space between this element and the ones next to it. If you remove your margin, there will be no extra space between your elements
It allows you to adjust the position of elements in the block
The z-index property specifies the stack order of an element
An element with greater stack order is always in front of an element with a lower stack order
The ID of a block, which is used in Custom CSS, Custom Javascript
The class of a block, which is used in Custom CSS, Custom Javascript
You can configure the Hover Styles by turning off the status of Default Hover Styles
a. Background
Solid: Applies a single color uniformly within the whole of an object by selecting the Background color
Gradient: It applies a continuous blend of two or more colors, where one color gradually fades and changes into another. You can choose the Gradient Style:
Linear: Change the angle of the gradient
Radial: Change the positioning (right center, left top, left center, etc)
First color & first color location
Second color & second color location
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
Inner Spacing (Padding): Padding is inside of the border (or edge) of your element. If you increase the padding, it will “push” your content into the middle of your box, away from your borders. If you remove the padding, your content will take up the entire box
Outer Spacing (Margin): Margin is on the outside of the border of your element. If you increase the margin, it will increase the space between this element and the ones next to it. If you remove your margin, there will be no extra space between your elements
It allows you to adjust the position of elements ịn block
The z-index property specifies the stack order of an element
An element with greater stack order is always in front of an element with a lower stack order
Solid: Applies a single color uniformly within the whole of an object by selecting the Background color
Gradient: It applies a continuous blend of two or more colors, where one color gradually fades and changes into another. You can choose the Gradient Style:
Linear: Change the angle of the gradient
Radial: Change the positioning (right center, left top, left center, etc)
First color & first color location
Second color & second color location
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
Inner Spacing (Padding): Padding is inside the border (or edge) of your element. Increasing the padding will “push” your content into the middle of your box, away from your borders. If you remove the padding, your content will take up the entire box
Outer Spacing (Margin): Margin is on the outside of the border of your element. If you increase the margin, it will increase the space between this element and the ones next to it. If you remove your margin, there will be no extra space between your elements
It allows you to adjust the position of elements in the block
The z-index property specifies the stack order of an element
An element with greater stack order is always in front of an element with a lower stack order
The ID of a block, which is used in Custom CSS, Custom Javascript
The class of a block, which is used in Custom CSS, Custom Javascript
You can configure the Hover Styles by turning off the status of Default Hover Styles
a. Background
Solid: Applies a single color uniformly within the whole of an object by selecting the Background color
Gradient: It applies a continuous blend of two or more colors, where one color gradually fades and changes into another. You can choose the Gradient Style:
Linear: Change the angle of the gradient
Radial: Change the positioning (right center, left top, left center, etc)
First color & first color location
Second color & second color location
It allows you to add shadow effects around an element's frame by selecting a shadow style (None, Light, Custom)
It allows you to specify the style, width, and color of an element's border
It allows you to define the radius of an element's corners
Inner Spacing (Padding): Padding is inside the border (or edge) of your element. Increasing the padding will “push” your content into the middle of your box, away from your borders. If you remove the padding, your content will take up the entire box
Outer Spacing (Margin): Margin is on the outside of the border of your element. If you increase the margin, it will increase the space between this element and the ones next to it. If you remove your margin, there will be no extra space between your elements
It allows you to adjust the position of elements in block
The z-index property specifies the stack order of an element
An element with greater stack order is always in front of an element with a lower stack order
You can set the condition to display the Slide show
Condition: It includes None, Show slide show when, Show slide when, Hidden slide show when, Hidden slide when
Field: It contains Business Object attributes
Index: The number of the row in the Business Objects Data table
Operator: It includes contains, does not contain, starts with, doesn't start with, ends with, doesn't end with, etc.
Value: you can input the value or select an attribute from Business Object or Event
The Business Object attributes in Field are selected Business Object in Template Setting
If Business Object in Template Setting does not be selected, a popup of Select Source will appear