Progress tracker
A horizontal row of numbered, optionally linked steps showing where a process has got to.
Use this to show a reader where they are in a sequence - an onboarding flow, a release checklist, an approval pipeline, a multi-page guide. Completed steps get a tick, the current step is highlighted, and upcoming steps stay muted. Each step can link to a Confluence page (via a page picker) or to any URL, so the tracker doubles as navigation across a set of pages that belong together. There is also an AI "Generate" button in the editor: describe a workflow in a sentence and it drafts the step list for you.
#See it
Every example below is a real macro on this page, not a screenshot, and each one is a configuration taken from a page somebody actually built. Open this page in the editor to see how any of them is set up.
#5 steps: Plan
#4 steps: Draft
#3 steps: Create account
#Settings
Setting | Values | What it changes |
|---|---|---|
Steps | Between 2 and 20 steps. Drag to reorder. | The steps, shown left to right. Drag and drop them in the panel to change the order. Add Step stops working once you have 20, and the delete button disappears when only 2 are left. |
Title (per step) | Free text, required | The label shown under the step's circle. |
Type (per step) | None, URL or Page | Whether the step's label is a link. URL shows a field for a web address, Page shows a Confluence page picker, and None shows the label as plain text with no link. |
URL (per step) | Any URL | Where the step goes when Type is URL. The field only appears when Type is URL. |
Page (per step) | A Confluence page, chosen with the page picker | Where the step goes when Type is Page. Clicking it opens that page in Confluence. |
Current Step | A step, chosen from a dropdown of your step titles | Where the process has got to. Steps before it show as completed, with a tick, the accent colour and a filled connector line. The current step is highlighted, and steps after it show as upcoming. |
Accent | Brand palette colour or custom colour | Completed step circles, the filled part of the connector line, and the current step's label. |
Current step | Brand palette colour or custom colour | The current step's circle fill and border. It is deliberately a darker shade of the accent, so the current position stands out from the completed steps. |
Track | Brand palette colour or custom colour | The unfilled part of the connector line, behind the accent fill. |
Upcoming text | Brand palette colour or custom colour | The labels of every step except the current one, plus the number inside an upcoming step's circle. |
Show Controls | On / Off | Has no visible effect on the tracker. You can leave it as it is. |
Show Details | On / Off | Has no visible effect on the tracker. You can leave it as it is. |
#Related
These carry state. Keep them true.
