A free player for showing H5P content on any website, no Drupal, WordPress or Moodle needed

alekswebnet's picture
Forums: 

Hi all,

People here often ask how to show H5P content on a plain website without installing a CMS plugin. I've built an open-source player for that and would like your feedback.

Try it

Open https://h5p-offline-player.vercel.app/, paste a link to any .h5p file, or pick one from your computer. It plays in the browser. Nothing is uploaded or unzipped on a server. A package from another site plays in a safe mode first, with none of its own scripts; if it needs them, the page asks before running them.

There's also an installable app at https://h5p-offline-player.vercel.app/app/ that plays .h5p files offline: install it once, and files open with no connection, on a laptop or an iPad.

 

Put content on your own site

It's a web component for developers: one script, one tag, no backend. The setup guide is at https://h5p-offline-player.vercel.app/demo/setup.html.

 

What it handles

  • Large packages start quickly and videos stream, even from slow hosts or hosts without range requests.
  • Exports without their libraries, like downloads from h5p.com, play against a bundled pack of the hub's content types.
  • Your file only needs to be hosted somewhere that allows cross-site access (CORS). GitHub Pages works as it comes.
  • Progress can be saved on the learner's device, so they return where they left off.

 

What it doesn't do

It only plays content. There is no editor and no results storage: xAPI statements are available to developers but not stored (there's a separate cmi5 package for LMS use). Video compressed inside the zip can be slow to start; a small tool in the project rewrites such packages so they stream.

Licence

The player's code is MIT. The H5P core runtime it loads is a separate package under GPL-3.0, as H5P core is.

This is an independent project, not affiliated with H5P Group. If a package of yours doesn't play, please post it here or open an issue on GitHub.

Thanks!

dgcruzing's picture

Wow, thats pretty cool and a great quick way to view them on disk.. 
Will have to explore this more and I already hit the Star on it.

alekswebnet's picture

Thanks!

 

I wrote about this player in the r/instructionaldesign community on Reddit and received some feedback. One of the most common questions was about how to embed this component into a website. There are the docs for intergation - https://h5p-offline-player.vercel.app/demo/setup.html