Timeline

Primary tabs

Submitted by H5P Group on Wed, 05/14/2014 - 11:16

A free HTML5 based content type allowing creatives to create interactive timelines. All you need is this content type and H5P.com or the H5P plugin in publishing systems like Canvas, Brightspace, Blackboard, Moodle and WordPress to start creating.

Would you like to create content like this on your own?

Get started

Register on H5P.com to start creating H5P Interactive content. Your content can be accessed via direct link, embeded, or inserted into any learning management system that supports LTI integration.

And more

Description

This is Timeline.js developed by Knight Lab, packaged as an H5P content type in order to make timelines easily editable, shareable and reuseable.

The Timeline content type allows you to place a sequence of events in a chronological order. For each event you may add images and texts. You may also include assets from Twitter, YouTube, Flickr, Vimeo, Google Maps and SoundCloud.

Learn how to create a Timeline in this tutorial.

Timeline.js project page

The H5P content on this page is licensed under Creative Commons Attribution 4.0 International unless another Creative Commons license is specified under rights of use. The author of the content is H5P Group

New to H5P? Read the installation guide to get H5P on your own site.

Comments

gtielemans

Thu, 08/11/2016 - 11:28

sorry, H5P filter was try-out from another attempt, not working

H5P is NOT implemented as Moodle filter (yet). Would be a killer app for Moodle users when it was..

fnoks

Fri, 08/12/2016 - 09:33

Hi,Since I am not that

Hi,

Since I am not that familiar with Moodle, could you describe what a Moodle filter is, and how it would benefit H5P for Moodle users?

Fri, 08/12/2016 - 10:34

filter in Moodle

Students (and teachers) can use a WYSIWYG editor in many places in Moodle.
For example: in an assignment, in a forum etc.
For security reasons Moodle does not allow to insert code in the editor.
If you try it, Moodle removes your code before it switches to view-mode..

There are two "filter" work arounds:

1. You can add a switch to start the entering of special code,
for example: $$ means "I will now enter TeX code" and you stop the entry also with $$

2. the other filter type is to attach a file with the chain symbol like in word.
Depending of the extension of the file - in your case .h5p - Moodle takes the file and does embed it in a player.
Some players also accept extra params, for example for height and width etc.
(Some filters also add a button in the toolbar to start the embed mechanism for that filter type.)

There is one third party filter where you can fill-in the code which is wrapped around the identified file: Generico.
So if we would know the embed code for H5P we also could use that filter, maybe?

Find the explanation here: https://moodle.org/plugins/filter_generico

I hope this helps, Ger

(to warn you: I am not a programmer but an horrible informatics-tourist)

Tue, 08/16/2016 - 08:20

Thank you for your

Thank you for your clarification. In WordPress and Drupal it is possible to do what you are asking for, so I guess it should be doable in Moodle as well. Relevant issue is found here

arturo

Thu, 07/21/2016 - 16:33

iframes

Hi, I was reading in the TimeLine JS documentation that it is possible to use iFrames if you are using a differnt type of media asset. I was wondering if there's a way to do it in the H5P timeline as well.

Thanks!

icc

Fri, 07/22/2016 - 11:07

Hi, unfortunately, this isn't

Hi, unfortunately, this isn't supported in the current version. But I don't think it should be too difficult to add support for it.

Wed, 08/10/2016 - 17:43

Thanks for the reply. Do you

Thanks for the reply. Do you think there's a chance to add support for it in the near future? or if maybe there's something we can do ourselves to add it?

Thanks again

Thu, 08/11/2016 - 10:26

Hi, if you are a developer,

Hi, if you are a developer, or have access to one, you could always make a pull request in GitHub. Read about how to contribute here

Tue, 08/16/2016 - 09:24

promising moodle filter

Thanks for the link, yes that is promising..

Elyse Lane

Thu, 08/18/2016 - 02:25

Timeline dates

Just tried to create a timeline dating back to 30,000 BC - couldn't figure out how to input anything before 0000,01,01. Any work around to create timelines for Ancient History?

Thu, 08/18/2016 - 08:22

Hi,Have you tried putting in

Have you tried putting in -30000 as date? It should work.

x4ecro

Thu, 03/09/2017 - 11:20

Add other h5p content

Dear all,

is it possible to add other H5P-content (e.g. an Ifram embedder) via shortcode (or any other way) as an asset to a timeline?

That would be awesome!

Cheers,

Robert

Fri, 03/10/2017 - 08:45

Hi,That would be really neat,

That would be really neat, but I am not sure if it can be done since it is built using a 3-party JavaScript library (Timeline.js by Knightlab).

perjonas

Thu, 03/23/2017 - 14:44

How to insert a picture in the body text in Timeline

Hi! I am wondering if there is anyone who knows if its possible to insert a picture in the body text in Timeline?

Thu, 03/23/2017 - 21:44

You can't add it inside the

You can't add it inside the body text, but it is possible to add images from e.g. flickr (located inside the Asset-group in the editor). I have made an example here: https://h5p.org/node/61979

JRDingwall

Thu, 04/06/2017 - 00:08

Three timeline questions

Hello,

I have input body text into an "era" in my timeline, and I can see the title and time span of the era, but how do I display the era body text? It does not appear the same way regular dates seem to work.

Is it possible to somehow put more than one asset into a date item?

Are there plans to upgrate the body text editor to either a rich text or html editor?

falcon

Mon, 04/10/2017 - 23:52

Hi,I'll try to answer the

I'll try to answer the last two. Only bad news I'm afraid :/ It is not possible to put several assets into one date as far as I know, and there are no plans regarding the body text editor. The good news is the anyone in the community may pick this up, improve and contribute the improvements :)

eveb

Sun, 06/04/2017 - 18:55

My thumbnails appear as very small images in the bottom half of the timeline but not in the upper part. The captions appear and the copywrite info, but there seems to be a gap where the larger image should go.

tim

Tue, 06/06/2017 - 10:28

Hi eveb, could you add a

Hi eveb, could you add a screenshot that describes your problem?

Thanks,

Tim

e-learning

Wed, 08/30/2017 - 17:52

I have this problem too?Did

I have this problem too?

Did you find a solution?

lkalache

Wed, 06/07/2017 - 06:33

cloning of timelines no longer works?

unable to clone timelines saved in h5p account, has the feature been removed? with existing timelines - clone button is there but saving always comes up with an error - help please?

BV52

Wed, 06/07/2017 - 06:47

Hi lkalache,I know the clone

Hi lkalache,

I know the clone option is a very helpful tool to help in efficiency. Sorry it has been temporarily disabled because it is causing some problems. We hope to get it back up and running as soon as possible.

-BV52

Tue, 06/13/2017 - 03:23

Timeline now restricted use?

thanks for the response - I note now that you cannot create timelines at all now, as the content type says an administrator has placed it under 'restricted use'. Can you explain what this means please - my understanding from previous posts was that the ability to clone existing timelines was being looked at.. but it seems the entire tool now requires permission to be used at all??

just looking for some clarification please,

thanks.

tomaj

Wed, 06/14/2017 - 07:47

Access

You can get access by going to this page: https://h5p.org/access-to-all-content-types

- Tom

Dmunday

Fri, 06/09/2017 - 13:56

Please can i have access to

Please can i have access to this?

Thu, 08/31/2017 - 09:13

You can get access by going

You can get access by going to this page: h5p.org/access-to-all-content-types

Fri, 06/09/2017 - 14:10

Hi, Can I have access to this and all options please? Thanks!

Mon, 06/12/2017 - 09:14

Access has been granted

leac

Fri, 06/30/2017 - 15:03

WP - BJ Lazy Load plugin prevents the timeline showing on sitte

I recently installed the BJ Lazy Load plugin on my site, and found out that is prevents the Timeline from showing up in the site using the shortcode (the timeline appears fine in the admin).

You can take a look at this page has the timeline shortcode, and you can see that the timeline is not displayed. When I turn off that plugin - the timeline displays fine.

Do you know what the problem could be? BTW, I have a multiple choice h5p activity that isn't affected by that plugin.

Thanks for any hint or direction!

Thu, 07/06/2017 - 15:17

H5P.init

Loading H5P asyncrously can sometimes lead to some difficulties, because there is a JavaScript function H5P.init that needs to be called on a dom element. And if the dom-element hasn't been loaded into the page, then the init function can't do its job.

Dan Mausolf

Tue, 07/25/2017 - 13:21

Embeded Videos in Timeline

Is there a possibility to embed short videos directly to the timeline (like picture or text boxes - example: the video will appearing next to a short text [like an image]) or is there only the possibility to use them via vimeo or YouTube?

--> Solved

goty2001

Wed, 07/26/2017 - 18:03

Embedded Videos in Timeline

... Dan did you solve the question about embedding videos ...how? I want to add videos & images to the body and resize them etc... wondering if that's possible?

Wed, 07/26/2017 - 20:11

Embedded videos

Hey gooty2001,

Yeah. Well there are several solutions. If you are using the timeline as additional feature for your homepage you can change the size of the timeline via the timeline homepage or the embedded html code (timeline code).

If you want to put videos (I prefer gifs) or picture as a background, just go to your Google document and add the Link in the background field. Your timeline will look great afterwards!

If you want to add videos make sure it's online as an YouTube or vimeo video or as an video all ready embedded on your homepage or another homepage. If so, you have the possibility to use the link of the embedded Video and just put it in your Google doc.

I don't know if there is a possibility to resize the images or videos in the timeline.

Cheers

Dan

Thu, 07/27/2017 - 10:38

Great thanks Dan ... I'm new to this and will be giving it a go next week and so I am just prepping what I can ... just one clairification when you say google doc .... is that google drive i.e. I can embed videos in the timeline body if I have them on a local Google Drive (if they're not youtube etc) .. does that sound right?

Thu, 07/27/2017 - 12:14

Well not exactly.
I was talking about the website https://timeline.knightlab.com/. Scroll down on this page and you will find the steps to create your own timeline. This includs, that you have to open and safe a google spreadsheet document.

If you are up to these points, just read my comment again and you will be able to adjust your background etc.

I actually dont know if its possible to add the videos from Google Drive. I've just tried it with videos, wich are embedded on other websites as an .mp4 or .mov.

Just try it out next week and give me a response if it worked with Google Drive videos.

Mon, 08/07/2017 - 11:55

Background Colour of Timeline

I was wondering if there will be an option to change the background colour of the timeline (the lower section, where the dates are shown). I know there is a possibility for the topic but not for the timeline.

Thanks for responds

Best regards

Mon, 08/07/2017 - 16:34

Hi Dan, The easiest way is to

Hi Dan,

The easiest way is to use a PHP hook, to add your own CSS-file to the content type. Please visit the Visual Changes page for more details.

Tue, 08/29/2017 - 22:42

Non-clickable images

Am I correct in understanding I have to use Flickr URLs to get images displaying in Timeline pages (the upper 'topic' part)???

If so, how can I make them non-clickable? Currently, when theyre clicked, the go to Flickr!! While I've seen that happen in a couple of sample timelines, most of the images are not clickable..

If Flckr URLs are not necessary - how else can I get an image to display. (I'm working in H5P in Moodle)

Thanks

Thu, 08/31/2017 - 09:08

Have you tried downloading

Have you tried downloading the images and then uploading them to timeline?

Wed, 08/30/2017 - 17:41

No images displaying?

I've made a timeline and added images as assets but when I go to look at the timeline none of the images are being displayed? This happens on both the embedded web version and the moodle plugin?

Any help?

Wed, 08/30/2017 - 17:56

Link to image example

https://drive.google.com/a/exeter.ac.uk/file/d/0B4YA2P9N-RMbVVBqTkhpMUNWLUk/view?usp=sharing

Thu, 08/31/2017 - 05:38

Hi e-learning,The image is

Hi e-learning,

The image is not accessible without your permission. Although I took the liberty of creating my own sample.

Only Media - Example from above

Media and Thumbnail - Combining both

Only Thumbnail

@e-learning and @goty2001 please confirm if the "Only Thumbnail" example is the concern.

Thu, 08/31/2017 - 10:26

Hi there, thanks for getting

Hi there, thanks for getting back to me. Yes, it's the only thumbnail 'version' that I can produce?

Thu, 08/31/2017 - 10:40

I've just been playing and I

I've just been playing and I guess just uploading an image from desktop will only create a thumbnail version? I've manged to link out to a flickr photo that does display large on the timeline but I can't link out to a wikipedia photo? It just displays the copyright? It seems pretty inconsistent.

Thu, 08/31/2017 - 09:12

I suspect this is not a link

I suspect this is not a link to an image file. Please have a look at the following discussion:
https://stackoverflow.com/a/13715473

begogga

Wed, 11/01/2017 - 20:46

How to put Centurys and a.c/b.c in the time line

Is there any way that I can put e.g V century b.c in my timeline? I need it for a presentation of the history of art.

Thank u!

Thu, 11/02/2017 - 02:50

Hi begogga,This is not

Hi begogga,

This is not possible as of the moment but I think this feature will add a lot of value to this content. Please head over to the feature request forum and post your suggestion there.

Thu, 11/02/2017 - 09:55

It is possible :), ref my

It is possible :), ref my comment below.

Thu, 11/02/2017 - 09:47

You can define BC dates in

You can define BC dates in the timeline, just add negative numbers for the year. Eg: -2000 for start date, and -1000 for end date will be year 2000BC -> 1000BC. I have created an example here:

https://h5p.org/node/136605

Mon, 11/06/2017 - 14:35

creating a timeline - spreadsheet or manual?

If I want to create a timeline in Moodle should I use the google spreadsheet method, or build it manually... is one preferred over the other? And If I use the spreadsheet - does the resulting package get uploaded and reside thereafter on the knightlab site?

You are here

Timeline

Primary tabs

Would you like to create content like this on your own?

Description

Comments

Pages