Skip to main content
All CollectionsPagesEmbed
Create an interactive timeline
Create an interactive timeline

Learn how to create an interactive timeline using TimelineJS from Knightlab and embed it into your AppicalNow course.

Danny Slotboom avatar
Written by Danny Slotboom
Updated over a month ago

Overview

Interactive timelines are an engaging way to present chronological information, such as historical events, company milestones, or product development journeys. Using TimelineJS by Knightlab, you can easily design a visually appealing timeline and embed it directly into your AppicalNow course.

Example

Imagine you want to onboard new hires by showcasing your company’s history. Instead of presenting a long block of text, you can use an interactive timeline. For instance, the timeline could highlight key dates such as the company’s founding, product launches, and notable achievements, allowing users to navigate through your organization’s journey in an engaging, visual format.


Steps to Create an Interactive Timeline

Access TimelineJS

  1. Click on 'Make a Timeline' to navigate to TimelineJS’s tutorial.

  2. Follow Steps 1 and 2 in their tutorial to create your timeline spreadsheet using Google Sheets.

Adjust Embed Settings

  1. In Step 3 of the TimelineJS tutorial, paste the published Google Sheets link into the designated field.

  2. Enter 400px for both the width and height dimensions. This will optimise the timeline's size for embedding in AppicalNow.

Embed the Timeline in AppicalNow

  1. In Step 4 of the TimelineJS tutorial, copy the embed code generated for your timeline.

  2. In AppicalNow, create an Embed Page by following this tutorial: How to add an embed page.

  3. Paste the embed code into the page.


👉 Let us know if this article was helpful by using the feedback buttons below. If you need further assistance, feel free to contact our Support Channel!

Did this answer your question?