Here you will find intro information about H5P and instructions for creating and managing H5P content on this Hub.

Important note: H5P activities are not intended for assessment and associated data collection. Instead, think of H5P as useful for a learner to build and test their knowledge through self-directed learning. H5P also provides novel approaches to present course content.

Read the H5P project license information for particulars on copyright, usage, and distribution.

Get Familiar with H5P and Content Types

  • Review the list of available content types to get familiar with the variety of potential uses.
  • Existing Hub members can demo available ‘content types’ in the Dashboard via H5P Content.
  • Want a low-stakes way to try out H5P before becoming a Hub power user?

Think about how you would apply H5P content to your instructional and curricular context.

Create H5P Content

A. Before Creation

  1. Sign into the OpenLab.
  2. Request site membership and an Admin will approve it shortly.
    • We are currently piloting this with a small group of faculty by invitation
  3. Think about accessibility. Before creating content, make sure you implement the same accessibility standards you would for your syllabus and other course materials, regardless of modality. The H5P content creation interface will include accessibility prompts for you to follow. 

Too new to H5P to start using the Hub? Join the H5P Sandbox to experiment.

B. Make Content

H5P Content creation happens in the Dashboard of the Hub site. Keep accessibility in mind.

  1. Navigate to the Site Dashboard and select H5P Content on the left navigation. (Note: there is also a shortcut on the Hub’s main menu, ‘Content Dashboard.’)
  2. Click ‘Add new‘ on the upper left. Here you can choose from the list of available content types (~27).
  3. Select the content type you will build by clicking on ‘Details‘ and ‘Use.’
  4. Populate your H5P activity with the required elements (text, images, etc.)
  5. Select ‘Create‘ on the upper right to create and save your activity.
  6. Once the activity is created, copy the H5P short code [ h5p id=”1″] on the upper right. You will use the short code as the first step to embed an activity on another site.

C. Embed Content into a Post

Why? Publishing your content on a post is necessary in order to embed content on another site. This is because the unique H5P short code generated for your content on the back end of the Content Dashboard, [ h5p id=”1″], is only functional on the Hub site. You need to copy the embeddable iframe URL for your content to display on other sites.

  1. Copy the H5P short code and paste it in a post. (The embeddable iframe URL will also work)
  2. Fill out the title of your post with this naming convention: Lastname, Firstname.
    • Note: Each member of the Hub site will have 1 post with multiple H5P activities.
  3. Select ‘Publish‘ in the upper right to save your post. After your post is published, view the activity ‘live’ on the Embed Library.

D. Copy the Embed Link into Another Site

Once you’ve created a post to display the H5P content:

  1. Click on the <>Embed link in the lower left corner of the activity.
  2. Copy the embed link from the pop-up box and paste directly into the page/post on your OpenLab site.
  3. From the pop-up box, highlight and copy the embed code: “<iframe src…”. 
  4. Navigate to another site, and paste the iframe URL directly into a post or page.
  5. Done!

A visual version of the above steps 1-4:

Edit Content

  1. Make changes to your content by navigating to the Content Dashboard via the site Dashboard.
  2. Identify the content you wish to edit from the list of all content and associated metadata (title, content type, author). Select ‘Edit’ on the right side to open the corresponding content.
  3. Edit your activity as needed and select ‘Update’ in the upper right to save changes. Changes to your content will automatically update wherever it is already embedded.

Manage Multiple Activities/Content

Remember that you can view, edit, and delete content you create from the list of all H5P content in Content Dashboard. Any edits you make to existing content will automatically update wherever it is already embedded.

Once you have multiple H5P content assets, manage your embeddable content via your own post, which is titled with your Lastname, Firstname.

  1. To display your own library of multiple H5P content created, repeat steps 1-6 from the ‘Make Content‘ directions above.
  2. After you copy the H5P short code associated with your content, paste it into the same post you created for the first activity, and so on.
Print this page