Timeline
LAB TIME: 30 MINUTES
CONVERT A SPREADSHEET INTO A TIMELINE TO EMBED IN ANY COURSE
IntroductionCreating a Timeline with Google Sheets and Knight Lab is an effective way instructors can present events throughout history or over any period of time. Rather than a static line with typed events, this Timeline is interactive and can contain images, video, audio, and even embedded iframes alongside the traditional text descriptions. The simple steps below will provide an easy way to create, edit, add and publish/embed your timeline into your course material.
|
Step One: Get The Template
Hop on over to Knight Lab's TimelineJS website and get the template for your timeline. Make sure you've signed into your Google account so that you can copy the Google Sheets file. Once you have the template, delete the placeholder content (not the header row!) so you can begin to add your timeline materials.
Step Two: Add Your Timeline Content
Every slide must have a start date, with an optional end date. In the video example, we've made a simple 5 slide timeline, plus a title slide, about the production of the CNM MILE on the History of New Mexico. Each column has comments in the header row that provides instructions on what you need to include. We recommend not using more than 20 slides to tell your story. You can always have more and it's easiest to interact (and create) bite size material.
Step Three: Publish Your Spreadsheet
When you are ready to preview your work, go to File > Publish to the Web > Publish. (This is Step 2 on the TimelineJS website, complete with pictures.) Copy the link provided. Go to Step 3 on the TimelineJS website and paste the link you just copied. Now click Preview to see the Timeline. You can also click Get link to Preview if you would like to see it by itself in a new window.
Step Four: Get the Embed Code
When you are ready to copy your Timeline into Bb Learn (or a website, or whereever your web destination happens to be), copy the embed code provided in Step 4 on the TimelineJS website. For instructions on how to embed an <iframe>, check out our Media Lab on Embedding Media.