Blum Timeline
Theme: Blum · Section type: All-template section
The Timeline section shows key moments of your brand in order, each with a label (such as a year), a heading, an image, a description, and an optional link. Use it to tell your brand story on an About page.
Note: You can add this section to any template, but not to the header or footer. The section comes with 5 Timeline item blocks.
What you can do
- Add the section and your milestones
- Add a link to a milestone
- Change the layout and colors
- See what customers see
- Look up every setting
- Fix common problems
Add the section and your milestones
- In the theme editor, open the template where you want the section.
- In the left sidebar, click Add section > Timeline.
- Under General, enter a Section subheading, a Section heading, and a Section description. Leave a field empty to hide it.
- Click a Timeline item block.
- Enter a Label, for example a year, then a Heading and a Description.
- Optional: select an Image.
- To add more milestones, click Add block > Timeline item.
- Click Save.
Tip: Keep the items in time order. Drag the blocks in the left sidebar to reorder them.
Add a link to a milestone
- Click a Timeline item block.
- Under Link, enter a Label, for example "Learn more".
- Add a Link.
- Optional: check Open link in a new tab.
- Click Save.
To hide the link, clear the Label field.
Change the layout and colors
- Click the Timeline section.
- Under Layout, select Items per row on desktop: 3, 4, 5, or 6.
- Under Timeline, select an Accent scheme to color the line and the labels.
- Select an Image ratio for all the images in the section.
- Under General, check or uncheck Collapse by default on mobile.
- Click Save.
What customers see
- Desktop: the milestones sit on a horizontal line, in a row. If there are more milestones than Items per row on desktop, customers scroll sideways to see the rest.
- Mobile: the milestones stack on a vertical line. With Collapse by default on mobile, only the label and heading show. Customers tap a heading to open the image, description, and link.
- Links: the link shows below the description. With Open link in a new tab, it opens in a new browser tab.
Settings reference
General
Setting | What it does |
|---|---|
Color scheme | Sets the colors of the section. You can edit color schemes in Theme settings > Colors. |
Section subheading | Small text above the heading. Leave it empty to hide it. |
Section heading | The main heading. Leave it empty to hide it. |
Section description | Short text below the heading. Leave it empty to hide it. |
Collapse by default on mobile | On mobile, shows only the label and heading of each item. Customers tap the heading to open it. Items need a heading for this to work. |
Timeline
Setting | What it does |
|---|---|
Accent scheme | Colors the line and the labels with the Main or Extra accent colors from Theme settings > Colors. |
Image ratio | Sets the shape of the images: Square (1:1), Portrait (2:3), Landscape (3:2), or Adapt to image. |
Layout
Setting | What it does |
|---|---|
Items per row on desktop | Sets how many items show in a row on desktop: 3, 4, 5, or 6. |
Content alignment | Aligns the section heading and description to the Left or Center. |
Remove padding top | Removes the space above the section. |
Remove padding bottom | Removes the space below the section. |
Timeline item block settings
Setting | What it does |
|---|---|
Label | Short text in a colored tag, for example a year. |
Heading | The heading of the milestone. |
Description | Text about the milestone. |
Image | An image for the milestone. |
Label (Link) | The text of the link. Leave it empty to hide the link. |
Link | Where the link goes. Appears when the link has a label. |
Open link in a new tab | Opens the link in a new browser tab. Appears after you add a link. |
Troubleshooting
On mobile, I can't open an item.
An item can only open and close when it has a Heading. Add a heading to the block, or uncheck Collapse by default on mobile.
My link doesn't show.
The link shows only when the Label under Link is filled in.
Some milestones are hidden on desktop.
If there are more items than Items per row on desktop, the extra items are off to the side. Customers scroll sideways to see them, or you can select a higher number.
The images have different heights.
Select Square (1:1), Portrait (2:3), or Landscape (3:2) under Image ratio instead of Adapt to image.
Related articles
Updated on: 26/10/2026
Thank you!