This tutorial will show you how to create a timeline using the free, open-source tool TimelineJS. An example of a Loyola student TimelineJS charting the history of the New Orleans Opera Association is available on the library website.
If you have any questions as you work through the assignment, please do not hesitate to contact me. You can email me at firstname.lastname@example.org, or make an appointment to meet with me via phone, video/web conference, or chat.
I'm Elizabeth Kelly and I am the Digital Programs Coordinator in the Monroe Library. I manage the library's digital programs including digital special collections and archives, digital preservation, digital scholarship, scholarly communications, and library web services. I’m also the librarian liaison to Mass Communications, Music Industry, Pop & Commercial Music, Urban and Electronic Music Production, and Digital Film, so if you take classes in those areas, you may see me again or want to reach out to me for research and technology help.
Part of my job is working with students and faculty who are interested in using digital tools in their research, either to help them do their research, or to help them tell the story of their research. In this tutorial I'm going to be working with you on an assignment where you create a collaborative digital timeline with your classmates.
For this assignment, you’ll be using a tool called TimelineJS which was created by the KnightLab Foundation. TimelineJS is free and open source, which means the code behind it is available for anyone to access and tinker with themself. Open source projects like this are very common in digital scholarship and the digital humanities. TimelineJS and similar programs are also frequently used by journalists to help them tell their stories in a way that’s visually engaging for online readers.
Information is added to the timeline by simply editing a pre-formatted spreadsheet in Google Sheets.* In the following steps, I will show you how to add information to the spreadsheet and populate the timeline.
*Note: your professor will provide you with the URLs for the Google Sheet and its corresponding Timeline
Following is a step-by-step tutorial on adding items to your timeline.
At any time while you are editing your Google Sheet, you can look at the timeline URL provided by your instructor to see how your event is displaying. There may be lag between when you edit the spreadsheet and when your changes show up on the timeline; be patient, and reload the timeline after a few minutes.
If your event is not displaying the way you want it to, check KnightLab's troubleshooting guides for help; contact me at email@example.com; or schedule a virtual meeting with me at calendly.com/elizabethjoankelly if it would help to look at your timeline together. Good luck, and I look forward to seeing your finished TimelineJS projects at the end of the semester!