User Guide

Search limit to:






Timeline

by Admin on Jul 01, 2025

1. What is Timeline?

Timeline feature allows merchants to showcase important milestones in their brand, products, or projects’ development journey.

The feature is a powerful storytelling tool that builds trust and helps visitors quickly understand your brand’s evolution and values.

Timeline section

2. Section Components

Section Timeline Creates a chronological display of important milestones in your brand, product, or project journey.
Available block Milestone Add individual entries with a title, date, description, and image/video.

3. Location & Setup

To add & set up the Timeline section:

  • Open the Shopify Theme Editor (Online store > Themes > Customize)
  • Decide where you want to place the new section.
  • Click “Add Section”.
  • Select Timeline.

4. Highlight Features

  • Chronological Display: Present milestones in sequential order for clear storytelling
  • Rich Media Support: Add images, Shopify-hosted videos, or embedded videos from URLs
  • Carousel Mode: Auto-advance through milestones with customizable timing
  • Interactive Navigation: Timeline axis with clickable milestone labels
  • Responsive Design: Adapts beautifully across all device sizes

5. Common Use Cases

🤔 How to set up Timeline section?

Want to set up a Timeline to highlight your brand’s milestones? Here's how:

STEP 1: Add the Timeline section to your desired location

STEP 2: Set up each Milestone block

By default, your Timeline section includes 3 Milestone blocks. If you want more, you can add up to 50.

Click on the Milestone block to open its settings panel and customize these:

  • Add Image or Video (Shopify-hosted or embedded via URL). If both are added, the image is shown as the thumbnail for the video.
  • Under Content settings group, you can:
    • Add Navigation label (milestone name on the timeline axis, e.g., 2022)
    • Add Subheading, Heading, and Description
    • Add a Button label and Button link

STEP 3: Customize the Timeline section look

  • Add a Heading — wrap text in [ ] to add a highlight effect
  • Add Subheading and Text
  • Choose the Media ratio: 1:1, 4:3, 16:9, or Adapt to media

STEP 4: Click “Save” when done.

🤔 How to enable carousel for the Timeline section?

Want to make the milestones auto-slide every few seconds? Here's how:

STEP 1: Click on the Timeline section to open its settings panel.

STEP 2: Under the Carousel setting group:

  • Adjust Change milestones every to set timing for auto-switching
  • Toggle Pause on hover to stop sliding when hovered
  • Toggle Next/Previous arrows to show navigation buttons

STEP 3: Click “Save” when done.

6. Support Information

Need help? Contact our support team at Omni Themes Support.