Timeline
Display an interactive timeline of events and progress
Broadcast includes a unique interactive timeline section to showcase events, milestones, goals or even age-based shopping options.
With modern animation effects, this section enhances the online shopping experience for customers who scroll down the page or click on the timeline hotspots.
Section settings
The timeline section can be used with or without images for simple text-based content or rich sliding images.
Mobile users experience a horizontal sliding version that's easy to swipe through.
Show images
checkbox
Toggle to display images alongside timeline entries.
Typography
Heading
text
Main title for the section.
Heading size
select
Controls the font size of the section heading: Mini, Extra small, Small, Medium, Large, or Extra large.
Text
richtext
Description text displayed under the heading.
Text size
select
Font size for the body text. Applies only when content is paragraph text: Extra small, Small, Medium, Large, or Extra large.
Alignment
select
Text alignment: Left, or Centered.
Layout
Width
select
Defines the section's content width. Applies only when images are used: Full width padded or Full width.
Mobile
Mobile height
select
Determines timeline height on mobile screens. Multiple screen % and px values.
Colors
Color scheme
color_scheme
Select the predefined color scheme.
Hotspot
color
Sets color for the timeline hotspot dot.
Padding
Top
range
Top padding in px.
Bottom
range
Bottom padding in px.
Advanced
Heading SEO tag
select
Defines the HTML tag for the heading, from H1 -H6 or Automatic.
Video Overview
This video demonstrates the configuration options for both desktop and mobile views of the timeline section and how to configure the timeline periods:
Last updated