Easy-to-make, breathtaking timelines.
TimelineJS can be an open-source tool that allows one to build visually rich, interactive timelines. Beginners can make a schedule nothing that is using compared to a Google spreadsheet, just like the one we useful for the Timeline above. Professionals may use their JSON skills generate customized installments, while maintaining TimelineJS's core functionality.
Recommendations & tricks
- Ensure that it stays quick. We recommend without having a lot more than 20 slides for a reader to click on through.
- Pick tales which have a very good narrative that is chronological. It generally does not work nicely for tales that require to leap around within the schedule.
- Write each occasion being a right component of a more substantial narrative.
- Add activities that build as much as major occurrences — not merely the major activities.
Media sources
TimelineJS can pull in news from many different sources. Twitter, Flickr, YouTube, Vimeo, Vine, Dailymotion, Bing Maps, Wikipedia, SoundCloud, Document Cloud and much more!
Mandela: a full Life of Function
Chronology for the French Presidential Race
Historic Fall at University of Missouri
North Korea's Nuclear Aspirations
Bulger on Trial
The Decline of IRS Nonprofit Legislation
Aurora, Colorado Film Theater Shooting
The Collapse of Microsoft and Nokia's Cellphone Company
How ISIS Spread to 10 Nations
Reported Sexual Assault Situations by Texas Educators
A brief history of Wine Around The Globe
The Mystery of Malaysia Airlines Flight 370
Revolutionary Consumer Interfaces
A history that is brief of Banana Company
The Republican Run-Up
Whitney Houston: 1963-2012
Produce a schedule
TimelineJS deals with any blog or site. Make your very very own in four steps that are easy.
Having problems? View our video clip, or begin to see the help part below.
Make your spreadsheet
Create A google that is new spreadsheet our template. You will need to duplicate the template to your very own Google Drive account by pressing the "Make a Copy" button.
Drop dates, text and links to media to the appropriate columns. For lots more about working together with our template, see our help docs.
Never replace the line headers, do not remove any columns, plus don't keep any blank rows in your spreadsheet.
Publish into the internet
Beneath the File menu, select “Publish towards the Web.”
The blue "publish" button in the next window, click. When expected, "Are you sure…?" click OK.
Now, copy the Address that seems in the exact middle of the screen. You will make use of this into the next move.
The following changed at the time of 18 July 2017!
Near the 'Publish into the window that is web. Copy the Address for the schedule through the web web web browser's target club. It must look something similar to this:
https://docs.google.com/spreadsheets/d/1xuY4upIooEeszZ_lCmeNx24eSFWe0rHe9ZdqH2xqVNk/edit#g >
Dismiss the Address that seems within the "publish to your web" window. It had previously been used below, but changes to Google signify you'll receive a mistake it now if you use.
Create your schedule
Copy/paste spreadsheet Address in to the package below to build your schedule. (be sure you've posted the spreadsheet.)
Share your schedule
Share Link
Utilize this to connect right to your timeline.
If you should be embedding on Medium.com or any other oembed-aware solutions, simply paste this link on a line by itself where you want your timeline to seem.
Copy this embed rule and paste it on your own web web site for which you need your schedule to seem (exactly like a YouTube video).
Preview Embed
Require assistance? First, please be certain to consider our directory of frequently asked questions below. If you should be completely new to Timeline JS, you may would also like to look at our basic movie.
If you do not find a remedy there, decide to try our help discussion boards or utilize our technology help internet kind. Please be clear together with your question, consist of a hyperlink to your spreadsheet, and in case appropriate, a web link to a web page which ultimately shows the presssing problem with which you want assistance. We are able to just answer help concerns in English. We act as prompt, but please realize that we do not have a separate technology help staff.
Find a bug? if you're confident you have got discovered a bug, please report it as being a GitHub problem. Make sure to include detail by detail directions on simple tips to reproduce the bug. If you are uncertain, please focus on the technology support system.
Technical documents
Go further with Timeline:
Faqs
How do you modify my schedule?
just What internet explorer does TimelineJS make use of?
What exactly are my alternatives for changing exactly exactly just how my schedule appears?
You will findn't sufficient choices. I would like more control of the font size/color/etc. Could I alter things making use of CSS?
How to categorize or cluster my occasions?
The very first sl > When making use of the Bing Spreadsheet to configure your schedule, in the event that you place the word name within the kind column, that slip are going to be placed at the front end, regardless of values when you look at the date columns. Begin to see the Google Spreadsheet documents to find out more.
Can I make news pictures clickable?
How do I format text line that is(add, bold, italics)?
tags to produce line breaks.
Just how do I enter BCE times?
How can I produce extremely dates that are ancient?
Who are able to access the info within my Google spreadsheet?
Privacy is essential if you ask me. Exactly Exactly How must I utilize TimelineJS?
Will my spreadsheet get acquired by search-engines?
May I make use of TimelineJS with WordPress?
Is TimelineJS free for commercial usage?
Storytelling Tools
We develop click for info easy-to-use tools that will help you tell better tales.
Timeline JS
Easy-to-make, breathtaking timelines.
StoryMap JS
Maps that tell stories.
Juxtapose JS
Easy-to-make framework evaluations.
Soundcite JS
Seamless inline sound.
The Northwestern University Knight Lab is really group of technologists and reporters working at advancing press innovation through research and experimentation.
