Embedding a timeline in your web page

Leave a comment

Embedding a whenintime timeline in your webpage is very straight forward.

  • First create a whenintime timeline
  • Next click on “Preview Timeline”
  • Click on the “Embed Timeline” button
  • Copy the HTML code to your webpage
  • Change the width and height as necessary to make the timeline fit appropriately

For examples of embedded timelines take a look at
Example 1
Example 2


Creating a timeline with whenintime

1 Comment

A picture is worth a thousand words. At whenintime.com we believe this applies to time-based data (e.g. historical facts). Using tools developed by whenintime.com you can view, explore and created highly interactive timelines on the topic of your choice. This article walks you through the steps for creating a timeline

1)      Click on the “Create Timeline” menu item from the home page at http://whenintime.com

2)      You will be asked to login. Enter your user id and password to login. If you do not have an account you can click on the Register link and follow the instructions to create an account

3)      Once logged in you should see the following

Create Timeline Screen Shot

1)      Enter a Title for your timeline (e.g. “Wars in Italy”)

2)      The second field represents the URL for your timeline. It will be auto-generated based on your timeline title but you can modify it. Please note that once the timeline is created you will not be able to change it.

3)      Enter a brief description for your timeline

4)      If you want you can upload an image for your timeline from your computer or you can provide an URL to an image. Please note that images are optional

5)      Next you can select who you want the timeline to be visible to. You can keep the timeline private or share it with everyone or with a selected group of people

6)      Similarly you can choose who can edit your timeline with additional data

7)      You can choose to allow others to be able to copy your timeline or you can disable that

At this stage you are done providing the basic information for your timeline.

You can click on the “Create Timeline” button and you will see the below webpage

At this stage you have an empty timeline. You can now edit the timeline details by clicking on the “Edit Timeline” link on the left hand side or you can click on “Add Events” to start adding events to your timeline.

There are multiple ways to add events to your timeline.

1)      You can enter events one at a time

2)      You can use a RSS feed to import events on your timeline

3)      You can copy events from an existing wheintime timeline

4)      You can upload events using a text file in a specific format

This article will cover entering events one at a time

To do so click on “Add Events” on the previous screen and you will see the following webpage

On this webpage you can enter the details of the event for your timeline. Only the event title and event year are mandatory on this form. Everything else is optional. Below is a screen shot of the form filled with data

Upon clicking “Add Event” this event will get added to your timeline and you will see the following webpage

At this stage your timeline has one event. You can add more events by clicking on the “Add Event” link

The timeline details will be visible once you move your mouse over the event. As an example take a look at the screen shot below

Editing events is straightforward as well. You can do so by clicking on “Edit Events” link from the left hand side menu and following the instructions.

To preview your timeline click on the “Preview Timeline” link. This will open a new web page. Below is a screen shot of what this page would look like. This is the how your timeline will appear to everyone else (if you choose to make it visible to everyone)