Documentation & Help | H5P.com integration (LTI)

Help

H5P.com integration (LTI)

This guide is for integrating with h5p.com's paid hosting service via LTI.
If you are looking for the Hosted version of H5P within the Xen platform, you can visit this guide instead: Using H5P interactives in your courses.

Educators around the world use H5P to create interactive learning resources and digital materials for their classroom. There are hundreds of H5P templates available to pick from and teachers and students can create interactive presentations, infographics and escape rooms easily and no programming or design skills required.

H5P aims to change the way we communicate, from static, boring content, to interactive, engaging presentations and materials. Visual, interactive content is normally hard and expensive to develop. But with H5P creating interactive content becomes, fun, simple and affordable for everyone.

H5P provides a solid integration with Xen.Ed through H5P.com.

Interactives content is created in h5p.com, and then inserted in any Xen.Ed course via the H5P (embed) component available from the Autoring Tool.

H5P.com adds the capability to use LTI. LTI stands for Learning Tools Interoperability, and is a standard that lets Xen.Ed talk to H5P and transmit data back and forth securely.

H5P.com also provides optional analytics so teachers can see what the learners answered to the different H5P questions.

How to use H5P interactives in your courses

The initial setup takes a few minutes, then will not bee needed again within the same course. If you are using it for the first time, there are 3 steps to follow:

Setup H5P.com
Setup Xen.Ed
Insert content in the course

Once setup on both ends, you can bypass the first 2 steps and will only need to insert content created in h5p.com.

1. Go to h5p.com

To get started with H5P in Xen.Ed just go to H5P.com and start a 30-day free trial.

2. Create content

First up, you want to create your content. To start this process in H5P.com, simply hit the Add Content button.

Once you've gone through the process of creating whatever activity you'd like to create, following the H5P author tutorials if needed, it's time to make sure we can insert it into Xen.Ed.

Also, ensure the permissions on your content are set to Protected. This ensures that only learners on your courses will be able to access your content.

3. Setting up H5P as an LTI provider

Note: You only need to do this once. Once H5P is set up as an LTI provider, you can continue to use this key for all of your courses.

The first step is to head into Manage Organization in the top right of H5P and select the Setup LTI tab from the left hand menu.

Enter a memorable label (such as your organisation site name) in the Label field, and hit Create.

When you hit Create, a Key will appear in the list below the Manage Consumers heading, with the name you've chosen.

You will need these values in Xen.Ed to configure the LTI passport.

The first piece is the Key, in the above image it's been edited to "yourkey-f5836".
The second is the secret, which is visible by hovering over the eye icon next to Secret. In this case our Secret is x2APPx89lX18ZRWaOYDsdrnz97V9uLiq.

These two pieces of information combined form what is known as an LTI "passport".

Please note: These values should be your own and be kept safe to avoid giving anyone access to your learner data!

4. Adding your LTI passport to your Xen.Ed course

Navigate to your course's Advanced Settings and scroll down or search the page to find the LTI Consumer Passports field.

The passport must entered in the format: "id:client_key:client_secret". The quotes are important:

The ID is what we use to tell Xen.Ed what key to use. In this case we'll use H5P as our ID, so that you can easily identify it later, especially if you setup several LTIs.
The client_key is the Key from h5p.com.
The client_secret is the long hidden text you get from hovering over the eye icon in h5p.com.

When put together, it should look like this:

["flat:bde5563f-a9d5-45da-b283-20c0a728e0b2:52f7ecdbe1d68a6223717367b024ab795243e07762346cc481aa850ee4487abc"]

5. Insert your content using the H5P.com (embed) component

Now that you have an LTI passport and some H5P content set up, the final thing we need to do is insert it into your course.

First, make sure to enable the component from your Admin/configuration panel. Make sure "H5P.com (embed)" is available in the list on the right.

Once this is enabled, navigate to the page where you want to insert the H5P activity. Under Advanced, select H5P.com (embed).

From the newly dropped component, select Edit. and set your Display Name to a name that matches your activity.

Then fill the URL field with the H5P.com for your activity. You should take this from the h5p.com website.

If your content is a problem that you want to grade, ensure that you set Scored to True and give it a Weight of however many points you want the question to be worth.

Note that this is useful even if the subsection isn't graded, as the learner's practice scores will still pull through to let them see that they've completed the activity and give the learner the satisfaction of seeing a correct score recorded.

Lastly, but most importantly, set Send Extra Parameters to True.

This will send details like the learner's email address across to H5P and allow their progress to be saved and recalled.

Was this article helpful?