Re-usability of H5P content is one of the key ingredients that makes this technology useful. In this tutorial, we'll cover some of the basics on how to re-use templates provided by Learnful to speed up your H5P content creation.

For the purpose of this tutorial, we'll be using the Architecture Template provided by Learnful.

Topics we'll cover:

  • Creating a copy of the template for our own use
  • Editing the template to make it fit our needs
  • Licensing and attributing the original work
  • Creating our own template from this template


The purpose of templates

First, a little bit about templates. Templates provide a framework or foundation for our content. Templates can provide design and structure queues, as well as graphic assets to speed up our content creation.

The idea of templates is that you simply need to swap out the content with your own, and your done!

Copying the Template

Below you'll find an h5p course presentation titled "Architecture Template". We'll be using and customizing this template in this tutorial.

Copying the template is fairly straight forward - you need to find the "Reuse" button located near the bottom of the h5p element.

Clicking on this button will provide you two options, we will select the second option: "Copy content".

Go ahead and copy the template above to proceed on to the next step!

Step 2: Creating a copy of our own

In this step we'll Paste the template we just copied thereby creating our own unique copy of the template.

Let's launch the h5p editor and find the paste button. Clicking on the Paste button will create a new h5p resource using the template.

Create new h5p content (opens in a new tab)



Share in your Class

Share on Social Networks


This embed code will display a stylized 'card' on your site that displays the thumbnail, title, and link to this resource.

A preview of what the styled card looks like is provided: