The timeline is a component that visually represents a sequence of events or steps arranged chronologically. It’s displayed vertically or horizontally, and is enhanced with images and text, to clearly and engagingly illustrate the progression.
The timeline component has optional title and description fields with a WYSIWYG editor. There is also configuration for choosing the position of the timeline. Depending on whether "vertical" or "horizontal" is selected, there is additional configuration for how the information is displayed on the right, left, center, etc.
Each timeline element has a title, subtitle, description, and image field. The elements are assigned a dot on the timeline to mark their position.
Timeline title
Position: Vertical orientation: right. Description Pellentesque commodo eros a enim. Nullam cursus lacinia erat. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. In auctor lobortis lacus. Nullam sagittis.
Fusce risus nisl, viverra et, tempor et, pretium in, sapien. Proin faucibus arcu quis ante. Sed hendrerit. Nulla consequat massa quis enim. Donec id justo.
First timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Second timeline item
Subtitle
Description praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Third timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Timeline title
Position: Vertical orientation: left. Description Pellentesque commodo eros a enim. Nullam cursus lacinia erat. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. In auctor lobortis lacus. Nullam sagittis.
Fusce risus nisl, viverra et, tempor et, pretium in, sapien. Proin faucibus arcu quis ante. Sed hendrerit. Nulla consequat massa quis enim. Donec id justo.
First timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Second timeline item
Subtitle
Description praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Third timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Timeline title
Position: Vertical orientation: center. Description Pellentesque commodo eros a enim. Nullam cursus lacinia erat. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. In auctor lobortis lacus. Nullam sagittis.
Fusce risus nisl, viverra et, tempor et, pretium in, sapien. Proin faucibus arcu quis ante. Sed hendrerit. Nulla consequat massa quis enim. Donec id justo.
First timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Second timeline item
Subtitle
Description praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Third timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Timeline title
Position: Vertical orientation: alternate. Description Pellentesque commodo eros a enim. Nullam cursus lacinia erat. Donec elit libero, sodales nec, volutpat a, suscipit non, turpis. In auctor lobortis lacus. Nullam sagittis.
Fusce risus nisl, viverra et, tempor et, pretium in, sapien. Proin faucibus arcu quis ante. Sed hendrerit. Nulla consequat massa quis enim. Donec id justo.
First timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Second timeline item
Subtitle
Description praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.
Third timeline item
Subtitle
Description Praesent adipiscing. In hac habitasse platea dictumst. Nullam quis ante. Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Pellentesque auctor neque nec urna.