Timeline

Section settings

General settings

Section width: Can choose among Default, Fluid Container, Stretch width, Full width for the section layout.

Color scheme: You are allowed to change text color, background color, etc. with preset color.

Section header

Use the provided text fields to add a suitable heading/description. Leave any of them blank if you do not want to display them.

Alignment: Adjust content (left/center/right) relative to the container.

Header size: There are 3 styles to choose from: small/medium/large.

Timeline setting

Design: Select display style the button and label for the slider.

Show image: Select show image of block.

Image position: Choose to place the content on the left or right side.

Image ratio: Select a preset ratio for the images.

Custom ratio: Active when Image ratio selects custom, helping to determine the custom ratio.

Width: Adjust the width of the slider to fit the visual layout and content requirements of your webpage or presentation.

Items per row: Set the number of items displayed per row.

Column gap: Adjust the distance between items in the carousel.

Carousel settings

Show next back: Displays arrow button next/previous in carousel that allow manual switching between slides.

Dot: Chooses the type of pagination to display at the bottom of the slider.

Auto change slides: After a certain time, the slide will automatically change.

Change slides every: Configure the time interval for changing slides.

Reveal next slide: Allows displaying part of the next slide.

Mobile options

Items per row: Set the number of items displayed per row on mobile devices for optimal layout and usability.

Section padding: allows you to specify the space between this section and the preceding or following sections, or both.

Block settings

Image: Select or upload an image for the banner.

Content

Use the provided text fields to add a suitable subheading/heading/timeline and description. Leave any of them blank if you do not want to display them.

Timeline: Appears when Dot selects Show progress bar, display below dot block.

Background: You are allowed to change background with preset color.

Content settings

Content alignment vertical: Adjust content vertically.

Spacing top: Add top spacing to the content.

Spacing bottom: Add bottom spacing to the content.

Content padding left/right: Add left/right spacing to the content.

Font-size: Adjust text size.

Font-weight: Choose the appropriate boldness for each type of content.

Uppercase: Convert all letters to uppercase.

Spacing bottom: Create space under each block.

Button label: Use the provided text field to add a suitable button. Leave blank if you do not want to display.

Button link: Paste the link (URL) that will be redirected when clicked. You can paste the link directly or find the link in the list (product, collection, page, blog…).

Type: Choose a display style for the button: - Primary – The button stands out, the main color of the brand - Outline – The border, softer - Link – Display as a link, no background, no frame