← Help Center

Make an Interactive Timeline

A printed timeline has room for a name and a date beside each event. An interactive one can hold much more, because the detail stays out of sight until someone asks for it. The reader sees the whole picture at a glance, then hovers over the event they care about to read the story behind it.

Every Preceden timeline works this way once you share it. This article covers what your viewers can do with it and how to give them something worth hovering over.

What viewers can do

When someone opens your timeline on a laptop or desktop and moves the cursor over an event, a popup shows its name, icon and dates, followed by its notes and any image attached to it. Hovering over a layer's name shows that layer's notes in the same way.

If the notes contain a link, the popup stays open while the cursor moves onto it, so the link can be clicked. Links open in a new tab, which leaves the timeline where the viewer left it.

Viewers can't change anything. They can download their own copy with the PDF and Image buttons beside the timeline's name.

1. Add the events

Start with the events themselves: add an event for each moment, and give longer ones an end date so they draw as bars. Keep the names short. The name is what everyone sees on the timeline, and the popup is where the rest goes.

Put related events on their own layers, such as one per team, person or theme, so a reader can follow one thread across the timeline.

2. Write the notes

The Notes field of each event is what makes the timeline worth exploring. It accepts Markdown, so you can use headings, bold text and lists to keep a long note readable. Layers have notes too, which suit an introduction to each thread.

  • Links: paste a URL into the notes, or write it in Markdown to choose the words it displays. Add a Link to Your Timeline shows both.
  • Photos: each event can have one image, which appears in the popup and in the list of events below the timeline. Add Images to Your Timeline covers uploading and cropping.
  • Videos: Preceden can't play a video inside the timeline, but a link to one in the notes works well. See Add a Video.
  • Files: a PDF or document can't be uploaded, but you can link to a copy stored elsewhere, as Link to a Dropbox File explains.

If notes or images don't show up in the popup, click Appearance above your timeline and open Content Visibility. The Notes and Images checkboxes under Display in Popup & Event List control them.

4. Share it

New timelines are private. To let others explore yours, choose how they get in:

  • A link: set the timeline's visibility to Secret URL or Password Protected, then share a link to it.
  • Your website: embed the timeline with an iFrame, and visitors can hover over its events without leaving your page.
  • A room: Presentation Mode shows just the timeline on your screen, and hovering over an event still shows its details as you talk.

On a phone held upright, viewers get a list of the events in place of the interactive timeline, so the notes and images are still there to read.

Sharing and embedding are available on every plan. The free plan allows up to 10 events on each timeline, which is enough to try it out, and our paid plans lift that limit.

Last updated