> ## Documentation Index
> Fetch the complete documentation index at: https://docs.kwebby.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Timeline

> Key years in your store's history on a line, each with a short title and text.

![Timeline on the storefront](https://mintcdn.com/kwebby/MS8e7xtq5qj3x24S/images/kelvin/timeline.webp?fit=max\&auto=format\&n=MS8e7xtq5qj3x24S\&q=85\&s=e5a09cb84c1772021eb6b7533d911671)

Timeline, highlighted with the demo content

## Where to find it

The about template (page.about). Create a page in **Online Store → Pages** with **Theme template** about, then in the theme editor choose **Pages**, then **about**, and select **Timeline**.

## How it works

* Events run across the page on a line, up to six per row; the last event gets a larger accent dot.
* Under 1180 px it shows up to three per row; under 750 px the line runs down the page with the events beside it.
* Year is set in the monospace font; Heading and Text show under it when filled in.
* Events are an ordered list, so screen readers hear them in order.

![Timeline in the theme editor](https://mintcdn.com/kwebby/QKNMzt7KPy_yk6ai/images/kelvin/editor-timeline.webp?fit=max\&auto=format\&n=QKNMzt7KPy_yk6ai\&q=85\&s=2f7583ea216aa265e8f574d6d4afdfc3)

In the theme editor: 1 the section in the sidebar · 2 its settings · 3 the section in the preview

## Edit it

* Add an Event block per moment (up to 12) with Year, Heading and Text. Keep Text to one or two sentences.
* Drag events into date order; the theme does not sort them.
* Edit Heading and Text, and set a Link id such as history if another page links here.

## Settings

| Setting | What it does |
| - | - |
| **Color scheme** | Color scheme for this area (edit the schemes in Theme settings → Colors). Default: Scheme 1. |
| **Link id** | Text. Lets a link such as #history jump to this section. Letters, numbers and hyphens. |
| **Heading** | Text. Default: How we got here. |
| **Text** | Formatted text. |

## Blocks

Add a block with **Add block** under the section in the sidebar; drag blocks to reorder them.

### Event (up to 12)

| Setting | What it does |
| - | - |
| **Year** | Text. Default: 2026. |
| **Heading** | Text. |
| **Text** | Text (several lines). Default: Describe what happened this year. |

> [!NOTE]
>
> On install the four events are placeholders: each Year reads Year, there is no Heading, and the Text is guidance such as Say when and where the store started. Replace them with your own dates.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.