Timeline Component

What is the timeline component?

The timeline component enables you to view records in a vertical timeline view in the order you choose. 



Adding Timeline

To add a Timeline choose the Timeline component and then choose the data table to be used for this Timeline. 

Once you've chosen the table, you can choose Quick Add which will add the Timeline with some default settings. Alternatively, you can choose Customize to configure all the settings manually. 

Choosing QuickAdd is simply a shortcut, you can always go right back into the component to make any changes necessary. 


Inside the Timeline component you'll see have some standard options available in other components, as well as unique settings only available in the Timeline component. 

  1. Data Source
  2. Fields
  3. Links
  4. Options
Data Source
The Data Source tab is where you can filter which records will be displayed in this component with some 'server-side' filtering. Since this is universal to all components you can view it as its own article here. Learn more about Data Source.
In the fields tab you can choose how to format each Timeline item and which fields to display. All the settings here will be applied to a each and every record in the Timeline. For example, in the illustration below you can see the settings vs how it will appear in your app: 


As part of the customization for each record you can add: 

  • Rows
  • Columns
  • Fields
  • Custom HTML

This works similarly to how rows and columns work in the page builder where Rows are the top level, columns are inside of rows and the fields are placed into a column. Using custom HTML you can further create very dynamic display of your data using raw values in the HTML component. 

To add fields, simply select the field you wish to add from the left-hand side: 



Timeline Field

To determine which field will be used for the timeline, choose the timeline field inside fields tab. 

The timeline field is the field that will be displayed along each timeline record. 




Since this is universal to all components you can view it as its own article here. Learn more about Links here.



In the options you can set the record limit as well as what to display where there are no records to be displayed.