How to create an Embedded Timeline
An Embedded Timeline lets site visitors scroll through past, present, and future events. These events can be marked with text, images, or both.
Embedded timeline styles "vertical by month" and "vertical by year" show a continuous vertical timeline as opposed to the existing scrollable horizontal timeline.
There are two steps to creating an Embedded timeline:
Create an Embedded Timeline
Embed the Timeline
| Info |
|---|
Content Authors cannot create an Embedded timeline. |
...
Create an Embedded Timeline
From the Administration bar select My Workbench > Create/Manage Content, and select Embedded timeline.
Select Add a new Embedded timeline.
Add the Title of the Timeline.
Select the desired Timeline style:
Horizontal:
...
Vertical by month:
...
Vertical by year:
...
Create a Timeline element.
Note: The background of each element block will highlight in yellow when the mouse cursor is on it.
Enter the Headline of the Timeline element (optional). Note: a Headline must be entered for the timeline to scroll when published.
Enter Content. Text and/or images can be entered. Images will be uploaded at cursor point. Note: Remember to add descriptive Alternate text.
Select the Date associated with the Timeline element.
Continue to add as many Timeline elements as required by clicking on the Add another item button.
Save and Publish.
Note: Embedded Timelines are Published by default.
A view of the completed Timeline elements will display as such:
...
Embed the Timeline on a Web page or other content type
| Note |
|---|
You will need to know the node ID of the Embedded Timeline just created in order to embed in another content type. |
The node ID can be found by hovering the cursor over the 'Edit' tab and noting the number after "node" at the bottom left of the browser window,
...
or by looking in the URL address bar after clicking Edit.
...
The Timeline can now be embedded in the body field of another content type, i.e. a Web page.
Place cursor where Timeline should be embedded and select the Add/Edit Timeline icon from the editing toolbar.
Enter the Embedded Timeline node ID (just the number) in the Timeline properties field and select OK.
Save and Publish.
The Embedded Timeline will display as such:
...
Other site templates
Conference
The Embedded Timeline content type is not available for this template.
Publication
The Embedded Timeline content type is not available for this template.
Single page
An Embedded Timeline is available on Single page sites when it is the only embedded piece of content on the Single page home (ex. not compatible with Embedded Call To Actions, Embedded Facts and Figures, and Image galleries).
Within Single page sites, bulleted and numbered list items are left-justified and do not have bullet or number indicators.