Add or Update Timeline Event

Events are the key component of any timeline. They represent anything from an upcoming project milestone to the building of the pyramids.

To add an event, click the Add Event button above your timeline or press Ctrl/Cmd + A on your keyboard.

To update an event, click the Event in the timeline.

The event name and start date are the only two required fields. Once they are entered, click either Add Event or Update Event to save your changes.

Name

The name is a required field. Every event must have a name to display on the timeline.

The position of the event name varies:

• If an event has a start date only, then its name will always be placed to the right of the icon.
• If an event has a start date and an end date, then its name will be placed within the color bar, if the name fits. Otherwise, the name will be placed to the right of the bar. You can change this behavior with the Bar Content Layout setting (Appearance > Events) to have Preceden always display the name to the right of the colored bar for the timeline that you are editing.

Color

Click the color to open the color picker and choose a color for the event bar.

The color picker shows a palette of colors to choose from as well as a set of Standard Colors, Legend Colors, and Recent Colors.

Click the swatch under Custom Color Picker to open your browser's color picker, where you can set an exact color using a spectrum, sliders, or a hex value.

Icon

Click the icon image to open the icon selector, then click the desired icon.

The icon is displayed to the left of the event name and in the event list below the timeline when the event only has a start date.

If you specify an end date for your event, the icon will appear when you hover over the event and in the event list below the timeline.

You can also request additional icons: Request a New Icon.

Shape

This option overrides the default event shape, which is set under Appearance > Events > Default Shape.

Click the shape image to open the shape selector, then click the desired shape. The shape appears in the timeline when the event has both a start and an end date.

Start Date

Every event must have a start date. Use the date picker, or type a date in one of the many supported date formats. If you have multiple events on the same day, you can enter a time after the date to organize the events in their proper order (e.g., November 23, 2019 7:30 am). When two events start at the same time they will be ordered alphabetically. You can also change the order by dragging an event to a new location.

Dependent Start Date

You can set one event to start when another event ends. We call these events Dependents because they depend on another event to determine their start date. When the Dependent checkbox is marked, the start date field transforms into a pulldown list which requires you to select the event that precedes this event.

You can read more about this here: Make This Event Start When Another Event Ends.

Approximate Start Date

For events where you don't know the exact start date, check Approx. next to the start date. The color bar then fades in to show that the start date is approximate.

Marking an event that only has a start date as approximate has no impact on how the event is displayed.

End Date

The end date is optional. Leave it blank when the event happens on a single date; fill it in when you want the event to span a range of time on your timeline.

Besides a date, this field accepts two shorthands:

• A duration measured from the start date, such as 3 days, 9 months, or 10 weekdays, which skips weekends. Preceden works out the end date for you.
• Present, Now, or Ongoing for an event that has not finished yet.

See supported date formats for the full list of both. Note that the end date is inclusive, so an event ending May 8 covers all of May 8 (more on that here).

Approximate End Date

For events where you don't know the exact end date, check Approx. next to the end date. The color bar then fades out to show that the end date is approximate.

Marking an end date as approximate for an event that only has a start date assigned has no impact on how the event is displayed.

Notes

This field is for any additional notes about the event. These notes will be displayed when you hover your cursor over the event on your timeline and within the list of events below your timeline.

You can also add links to the notes.

See our guide on markdown formatting for examples and answers to common questions and issues with editing notes.

Layer

When your timeline contains multiple layers, use this dropdown to specify which layer you want to associate with the event.

To add a layer, click the Add Layer button above the timeline (see Layers for more details).

More Options

Click More Options to show or hide the additional event fields.

Image

Click the Choose Image button to add an image to the event. Each event can have one. Learn more here: Add Images to Your Timeline

Percent Complete

Track progress for the event by choosing a percentage from the dropdown. Preceden shades in that percentage of the bar on the timeline for events with a start and end date. Percent complete values are displayed on the timeline by default, but you can hide them under Appearance > Content Visibility.

Connected Events

Type and select a name in the Connected Events field to have a relationship line drawn between the current and the selected connected event. Click the X next to a previously chosen Connected Event to remove the relationship line. There is an option to select either a Solid Line or a Dashed Line.

Make This Event a Milestone

A milestone represents an important event that you want to stand out on your timeline.

When you check the milestone setting, only a start date can be specified and the event will be displayed as a vertical line that spans the full height of the timeline:

Content Visibility

Use the Hide name, Hide dates, and Hide duration checkboxes to keep displaying the event bar while hiding those details on the timeline. Each one overrides the timeline's own Content Visibility settings for this event only. Any associated image or percent complete will continue to be displayed.

Duplicate an Event

When you're updating an event, click the Duplicate button at the bottom of the form to create a copy of it as a new event.

The copy is made from whatever is in the form when you click, so you can change the name, dates, layer, or anything else first and the new event will be created with those changes already applied. Those changes apply only to the copy: the original event keeps the details it was last saved with.

The Duplicate button doesn't appear once the timeline has reached your plan's event limit.

Create Several Events in a Row

When you're adding an event, check Create another next to the buttons at the bottom of the form. After you save, a blank Add Event form opens right away so you can enter the next one, as long as your plan's event limit leaves room for it.

To add a lot of events at once, the Bulk Editor or a CSV import is usually faster.