Creating H5P Content in Moodle

On your Moodle page, turn on the Edit mode. The Edit mode button is found at the upper right of your screen. A red + button will appear when the mouse hovers over areas; click on the + button and add your activity.

In the window that appears, type “H5P” into the search bar and select the “H5P” option from the list of activities.

This will bring you to the activity creation page where you can name the activity and access other editing options. To create the actual H5P content select the “content bank” link to take you to your H5P content bank.

In your content bank you can see previously created H5P content along with an “ADD” button with a dropdown menu that allows you to select what kind of H5P content you wish to make.

After selecting the type of content you wish to make it will take you to the creation page for that content type. From here you can fill in the elements of your content. When you are finished creating your content you can press the “Save” button. This will create your new H5P content and add it to your content bank.

From here you can return to the activity creation page and press the file selection button which will open up the file picker.

In the file picker you can select “Content bank” on the left of the window to bring up the H5P content in your content bank. You can now select the H5P content that you just created and add it to your activity by selecting it. For information on the different types of H5P content in Moodle you can look at this page.

Selecting the file in the file picker will bring up another window with some more file options, press the “Select this file” button to select the file.

You can now select the “Save and return to course” button to create your new H5P activity.

For examples of H5P content check out these pages:

Creating H5P content in WordPress

H5p can be created by logging into your blog, then going to your blog’s Dashboard. If you are viewing your blog, click on the Dashboard icon at the top left of the screen (see the image below for the Dashboard icon..

Dashboard icon highlighted in red

Choose H5P Content from the side bar, then choose the “Add new” button. Select the H5P experience you want to add to your blog.

Choose the content type you want to add. Each content type is different, so you may be presented with different choices, depending on what you want to do.

Regardless of the content type, the process is the same for each content type:

  1. Create your content type.
  2. Save your content type.
  3. Copy the shortcode.
    While viewing your H5P content, you will see a Shortcode area to the right. Copy the whole shortcode, including the brackets. In the screenshot below, the shortcode was copied. Make sure to include the brackets.
  4. Create a new page or edit an existing page. You can usually paste in the shortcode into an empty paragraph block, but otherwise you can choose a Shortcode block, and add the code there. Click the publish button to view the H5P content now in your page.

You can edit your H5P content at any time, and the page/post that it is embedded on will update automatically.

For examples of H5P content check out these pages: