Skip to content

Embedding timelines

Any Histropedia timeline can be embedded on a website or blog by using the embed code that is shown on the Share Timeline screen. 

Click on  to access the Share screen.

The timeline will be displayed inside an IFrame with a default height of 567px and width of 940px.

You can embed timelines that were created by you, or by any other user (as all timeline are shared under a CC BY-SA 3.0 licence)

However, it is advisable to save a copy first if you are planning on embedding someone else's timeline, otherwise they will be able to save changes to the timeline which will affect the content that is visible on any embedded versions.

Embedding a timeline you have created

  1. Save your timeline - you must do this before it can be embedded (or shared in any other way). More info on saving can be found here.
  2. Click on the share button.
  3. Copy the embed code.
  4. Paste embed code into your website or blog.
As you are the owner of a timeline embedded in this way, you can save changes to the timeline at any time. This will update the original timeline url, so any embedded versions will be updated automatically.

Embedding a timeline another user has created

As mentioned above, it is advisable to first save a copy of the timeline so that you are publishing a version that you have control over. 

However, there are some instances when you would like to embed another user's timeline directly. For example, if it's a user that you trust and would like to always see the latest improvements they have made to the timeline.

Step two below can be skipped if you would like to embed another user's timeline in this way and keep up to date with their changes.
  1. Load the timeline you wish to embed by clicking on any link.
  2. Click save and select 'save new' to save a copy of the timeline to your account (optional).
  3. Click on  
  4. Copy the embed code.
  5. Paste the embed code into your website or blog.

Advanced controls

Although the default size for the embedded timeline is 940px by 567px, you can change these values to whatever you want by editing the embed code directly.

However, be advised that the timeline becomes gradually less usable as you reduce the width of the embed version, and the height of 567px is around the minimum that can be used.

Apart from the general usability issues, there are some features that will disappear below certain widths:
  • Below 600px wide, the 'stack' button will disappear (button to automatically organise the events on the screen)
  • Below 480px wide, the entire reading window will disappear, so there will be no related content available for the events on the timeline (Wikipedia articles, YouTube videos etc)
Always check your embedded timeline thoroughly if you have changed the default size.

The embed feature is still at quite an early stage, so please let us know if you have any issues or suggestions for improvement.

Feedback and Knowledge Base