H5P

What is H5P?

H5P is a free and open-source content collaboration framework based on JavaScript. H5P is an abbreviation for HTML5 Package, and aims to make it easy for everyone to create, share and reuse interactive HTML5 content.

Using H5P, you can create additional types of interactive content including quizzes, games, calculators and more, and use them in your course!

Here's a glimpse of a few components available on H5P: (see the full list here)

A few examples of H5P exercises and activities

Adding H5P Components to Your Course

1) Create an account on H5P (link) 2) Login to your account (link) 3) In the header menu select < + Add Content > 4) Select and create the desired content type. 'Save' when you're done.

TIP: You can create as many H5P components as you like! There are tutorials / examples available on the H5P website in case you need help.

5) In the header menu select < Manage Organization > 6) Select < Add LMS Connection > 7) Choose 'Other' for your LMS, enter a connection name and choose the LTI v1.1 version.

8) Select to 'Save', and keep the window / tab open. 9) In a new window / tab, open your course in MOOCit Studio 10) Select Settings > Advanced Settings 11) Under 'Advanced Module List' add "lti_consumer"

12) Obtain the key + secret by select 'Manage Organization' > 'Connect LMS' in your H5P account.

13) Back in Studio > Advanced Settings, locate 'LTI Passports', and add: "id:key:secret".

14) Save changes in Studio > Advanced Settings. 15) Open up the course unit where you wish to add the H5P component. 16) Under 'Add New Component' Select 'Advanced' > 'LTI Consumer' 17) Select to edit the component. 18) In your h5P account select 'Manage Content' and right click on the desired component to copy it's web URL.

19) Back in Studio, in the LTI Consumer Component Editor, add LTI ID = id LTI URL = 'paste your URL' Select to save.

20) Select to 'Publish' and 'View Live'

🥳 Congratulations! You've just configured your H5P Component!