How to create an embeddable timeline chart


The other day, web developer friend asked me how to create and insert a timeline into WordPress. He actually wanted to put an interactive timeline with links, images and video on the homepage of a news site.

I checked out several options out there and settled on TimelineJS. You can create timeline charts directly on their web site. Each story in the timeline has to be loaded as rows in a google spreadsheet. You can enrich each of the “steps” or events with links, videos and pictures and everything’s stupid-easy to use.

At the end you get an iframe embedding code that you can copy and paste to your site. But they even have a WordPress plugin for that. There’s even other developers who have created alternative tools based on TimelineJS that allow you to play with more settings.

So if you ever need a quick and dirty solution to build a timeline and tell a story, look no further.

 

Now, if you’re a developer and you want a proper, scalable and maintainable solution, that’s another story.

In the case of my friend, depending on an external site for such a crucial part of a website is not a good idea. What if these guys decide to abandon the product (hope not!)? What if their site goes off-line? My friend may lose his content temporarily or permanently. It’s not maintained by him, it’s not hosted by him, it’s not backed up by him. His content it’s not his.

So, the correct solution is to find a way to self-host a similar solution.

Fortunately and amazingly, TimelineJS is an open source tool and it’s on GitHub. If you’re a developer like my friend, you can download the source code, copy it to your server and that’s it. You’ll have a fledged timeline builder in minutes.

 

By Daniel Pradilla

Soy arquitecto de software y ayudo a la gente a mejorar sus vidas usando la tecnología. En este sitio, intento escribir sobre cómo aprovechar las oportunidades que nos ofrece un mundo hiperconectado. Cómo vivir vidas más simples y a la vez ser más productivos. Te invito a revisar la sección de artículos destacados. Si quieres contactarme, o trabajar conmigo, puedes usar los links sociales que encontrarás abajo.

Discover more from Daniel Pradilla

Subscribe now to keep reading and get access to the full archive.

Continue reading