Sequences
A sequence can be used for short blocks of content that need to be viewed in a linear or sequential order.
See and interact with the Sequences component block demo on this page.
Demo component
Classic sequence variant example
Similar to an accordion but all the items are open.
Use this Overview field to provide an overview of the following sequence.
#1 subtitle H3
This is the tab item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
#2 subtitle H3
This is the tab item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
#3 subtitle H3
This is the tab item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
Numbered accordion variant example
Displays like an accordion but by design each item has a sequential number applied and there is an option to Show all or Hide all to open or close all items at the same time. The audience can also open and close each item individually.
Use this Overview field to provide an overview of the following sequence.
Subtitle heading 1
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
Subtitle heading 2
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
Subtitle heading 3
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
Timeline sequence variant example
Displays like an accordion but by design each item has a circle and there is an option to Show all or Hide all to open or close all items at the same time. The audience can also open and close each item individually.
Use this Overview field to provide an overview of the following sequence.
#1 subtitle heading
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
#2 subtitle heading
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
#3 subtitle heading
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the accordion items should have a relationship to one another as part of a sequence.
Steps – numerical variant example
Displays like an accordion but all the items are open and by design each item has a sequential number applied.
Use this Overview field to provide an overview of the following sequence.
Subtitle heading 1
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the sequence items should have a relationship to one another as part of the sequence.
Subtitle heading 2
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the sequence items should have a relationship to one another as part of a sequence.
Subtitle heading 3
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the sequence items should have a relationship to one another as part of a sequence.
Steps – alphabetical variant example
Displays like an accordion but all the items are open and by design each item has a sequential capitalised alphabetical character applied.
Use this Overview field to provide an overview of the following sequence.
#1 subtitle heading
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the sequence items should have a relationship to one another as part of a sequence.
#2 subtitle heading
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the sequence items should have a relationship to one another as part of a sequence.
#3 subtitle heading
This is the sequence item’s body copy. You can include sentences, lists and links.
Each of the sequence items should have a relationship to one another as part of a sequence.