Creating H5P XBlock

Hello Everyone,


I am getting started with an H5P XBlock development. For the once who are not familiar with h5p, H5P is a platform that lets you create various kinds of activities that can be implemented in courses. If someone is interested to get insights of these activities can visit Examples and Downloads | H5P. H5P supports over 50 activities that are interactive and engaging.

Motivation behind developing this XBlock

H5P is open-source project and currently it can be implemented in edx using LTI functionalities. However, there is downside to this approach.

  1. It is complicated to implement.
  2. This approach depends on hosting which is costly for many users.
  3. One needs to depend on external website ( for creation of activities

End Goals

Create an XBlock that supports most h5p activities that can be hosted within open edx at no extra cost and there are no dependencies to external services. This will be open source for everyone to us.

In order to achieve these goals, I need few clarifications as below.

  1. Can XBlock create and access a specific directory at the installation time?
    Context: H5P activities are built on several libraries. I would like these libraries placed within edx code base while installing this XBlock

  2. Can XBlock store and access .json (also images, audio and video) files at the run time?
    Context: These activities will be created based on inputs by author and these inputs needs to be stored in form of .json file. In few activities user may also need to use images, audios or videos. These files needs to be stored within our instance at the run time without having to run compile assets

  3. Can XBlock grade student with help of javascript?
    Context: H5P renders score using java script. Can XBlock capture this values and grade user?

It would be great if some of you can express what you think on the above question? What are standards to follow or how would you go about it?

There are some more questions which are as below

  1. What is the best way to implement 40+ activities under XBlock?
    What I have generally observed is one XBlock usually implements one task. What I am attempting is to have one XBlock that can implement nearly 40 activity types and user to be able to choose among them. So, is there any suggestion how to go about this?

  2. How best to create a ActivityCreationFormat so that it is user friendly?
    This is the most complicated piece of the puzzle. Once user selects what activity they would like to create, they can be presented some sort of user interface where pre populated form is presented and user needs to supply the parameters related to their activity/question/answer. I am planning to use simple interface that edx uses for some of existing XBlocks such as MCQs. Have some one developed something more sophisticated than that? How to implement a link generator button where user clicks the link to upload image, audio or video and generate a link just like edx studio upload option but within XBlock interface.

  3. Any advice??
    Anyone who has any advice or suggestion that I shall consider??

Apologies for making this post so lengthy. If anyone is interested on process/logic/idea behind the XBlock, I will be more than happy to share it here.


1 Like

It is an excellent idea to build support for executable H5P-files from within Open edX. That would be similar to the support for H5P in Wordpress, Moodle and Drupal. An xBlock for rendering HTML5 packages would resolve the cost issue for many users since it is possible to use one of the latter system as the development server and repository for H5P-content. To build a complete system for building, managing and serving H5P content is not a simple task, though. The folks at LUMI in Germany are trying to build a standalone solution, - see Lumi Education

Good luck!

Hi @helgeh

Well this have been taken care off. I have tested and integrated h5p activities in some of my demo instances. Its just that its too many steps right now. So what i wish to do is simplify the process in terms of XBlock.

What I have done so far is simplified a file system for the purpose of reusability. with this in place we need only two files being generated.

  1. Json
  2. html

Json would take care of user/activity specific data.
html would be pre populated.

Thank you, @Sujit_Patel. This is good news!

I hope Open edX may be configured as true OER with an option of direct public access as is now available for other content. H5P offers a good alternative to Open edX problems in this respect.

Hello everyone,


Well I took a look at an existing XBlock i.e. xblock-drag-and-drop-v2 . This Answers most of my questions and can be great reference for me to base my xblock on. So I am going to make some progress on this task. However there is still one question that can help me.

How to go about having 40+ activities within the same xblock??
i.e. when user chooses h5pXBlock. he/she is prompted to decide what activity they would like to create and when the selections has been made XBlock takes them to related creation form/ui.

Could you share the method of integration you followed for your demos?

Edly has developed H5P xBlock for the Open edX. It has the ability to self-host and play H5P content in Open edX. Providers can upload new H5P content or reuse existing content on this xBlock on their Open edX installations.

Here are some unique features of this xBlock:

  • Ability to self-host H5P content on your Open edX
  • Capture the H5P content score and integrate it with Open edX’s scoring and grading modules
  • Ability to mark H5P content complete in open edX automatically
  • Save learner state after certain intervals

Here are the steps to setup and play H5P content using this xblock.