> For the complete documentation index, see [llms.txt](https://docs.notionapps.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.notionapps.com/how-to-guides/status-timeline.md).

# Status Timeline

## Status Timeline

### Status Timeline

Show a horizontal **Status Timeline** on Details so users see where a record sits in its Status lifecycle (past → current → upcoming options).

{% hint style="info" %}
**What changed**\
A new view component, **Status Timeline**, binds to a Notion **Status** property and renders options in order with the active status highlighted. It is read-only display — use Board drag, Update Form, or multi-row update to change Status.
{% endhint %}

***

#### What you get

| Capability      | Maker setup                                | End-user result                            |
| --------------- | ------------------------------------------ | ------------------------------------------ |
| Lifecycle strip | Add **Status Timeline**, bind Status field | Options in a horizontal progress-style row |
| Active marker   | Automatic from record value                | Current status emphasized                  |
| Option order    | From Notion Status options                 | Matches Notion’s configured order          |

![Details with Status Timeline (Status Progress)](https://iili.io/Cwe3bnI.png)

***

#### Before you start

* A Notion **Status** property with the options you care about
* A Details screen
* **Reload Data** after editing Status options in Notion

***

#### Step 1 — Add Status Timeline

1. Open the Details screen.
2. **Add component** → **Status Timeline**.
3. Bind it to the Status property.
4. Optionally set a label (for example **Status Progress**).

***

#### Step 2 — Preview across statuses

1. Open records in different statuses (Not started, Scouting, Open, Closed).
2. Confirm the timeline highlights the correct active option each time.
3. **Publish** and re-check in the live app.

***

#### Checklist

* [ ] Status Timeline bound to Status
* [ ] Option order matches Notion after Reload Data
* [ ] Active status is obvious for several sample records
* [ ] Changing Status elsewhere (Board / Update Form) updates the timeline after refresh

***

#### Troubleshooting

| Symptom                      | Likely cause                              | Fix                          |
| ---------------------------- | ----------------------------------------- | ---------------------------- |
| Missing options              | Stale sheet metadata                      | Reload Data                  |
| Wrong active step            | Record Status empty or different property | Bind correct Status field    |
| Want to edit on the timeline | Component is view-only                    | Use Board DnD or Update Form |

***

#### Related reading

* [Board List View](https://docs.notionapps.com/guides/board-list-view) — change Status by dragging columns
* [Status and People Field Fidelity](https://docs.notionapps.com/guides/status-and-people-field-fidelity)
* [Board layouts and Details polish (overview)](https://docs.notionapps.com/guides/board-layouts-and-details-polish)
* [20 Jul 2026 Release](https://docs.notionapps.com/release-notes/20-jul-2026-release)

## Builder options at a glance

This guide teaches a focused maker workflow. For the full screen option inventory (What it does / How to use / Why) and annotated builder screenshots, use the matching **Types of Screens** guide:

* Data screens: [List (View Items)](https://docs.notionapps.com/screens-and-components/types-of-screens/list-view-items), [Details](https://docs.notionapps.com/screens-and-components/types-of-screens/details-view-one-item), [Form (Add Item)](https://docs.notionapps.com/screens-and-components/types-of-screens/add-new-item-form), [Form (Update One Item)](https://docs.notionapps.com/screens-and-components/types-of-screens/form-update-one-item), [List (Update Items)](https://docs.notionapps.com/screens-and-components/types-of-screens/update-items-form), [Content](https://docs.notionapps.com/screens-and-components/types-of-screens/content)
* Everyday chrome / Queue & activity: see the [Types of Screens](https://docs.notionapps.com/screens-and-components/types-of-screens) index
* Automation native screens: [Native Automation Screens](https://docs.notionapps.com/screens-and-components/types-of-screens/native-automation-and-operational-screen-guides)

### Recommended defaults

* Change one option family at a time, then publish and test on phone and desktop.
* Prefer screen-level settings in Content / Behaviour / Appearance before custom CSS/JS.
* Keep public access and navigation visibility intentional on every screen you link from this guide.