Create QR Codes with H5P

I don’t know about you, but when I really need slides for a presentation that I have to give, then I use H5P Course Presentation. Sometimes I want to include some (impressing :-)) interaction with the audience, sometimes just because I like H5P although other software might be more suitable for that particular job. I also often put QR Codes on some slides to allow accessing some complementary material, some online service such as online voting that I include into my performance, etc. However, I had to use an external service to create the QR Codes, download the image, upload it to the presentation …

Alas, not anymore …

You’re right, I created an H5P content type that you can feed text into and it will give you a corresponding QR Code. Pretty neat if you put the library into Course Presentation. But it can even make sense to put one on your website. Really? On first thought, it might seen strange to have a QR Code on a website. Why place it there if people obviously are already online and could simply click on a link?

Well, many people still print web pages, and the QR Code could provide them with an easy way to return. But there’s more. QR Codes cannot only hold links to websites, but any text. Given the right format, you can present contact information and allow users to put them into their address books directly, there are ways to initiate mobile payment, you can start a call directly, you can open a location on Google Maps, you can put event information into a calendar, you can install an app, etc. Can be pretty useful if you’re using some web resource or H5P Course Presentation to present things on-site and want people to access something on the web, leave your contact info, …

So, if there’s a chance someone is browsing your website on a desktop, but you want to trigger something that rather requires a smartphone, it might also be a good idea to offer a QR Code.

Just try these examples (you can play around with size, positioning and color, too)…

Currently supported

  • contacts: add a contact to the address book
  • events: add an event to the calender
  • email address: send an email
  • location: open a maps app to show the location
  • phone number: call a number
  • SMS: send a text message
  • text: display any text (can be used as a workaround for other services)
  • url: open a web page

[Update] I assume I’ll add some “touch to reveal content” feature shortly, so you can at least see what’s “hidden” behind the code if you can’t scan it.

[Update] There’s now a first draft of the “touch to reveal content” feature that I will make nicer – might be done already if you read this 😉

[Update] I completed the content type and asked for a review, so it can be released officially.

Please give feedback!

I hope you will soon be able to do that officially using H5P. Integrating it into Course Presentation could also make sense and should just take around an hour to do. But maybe there’s something that you’re missing right now? Please let me know!

Feel free to use the source code: and have a look if you might want to become one of my patrons on patreon.I

p. s.: If you wonder why I called the content type KewAr Code … The word QR Code is a registered trademark of DENSO WAVE and I while it seems to be common to ignore that, I don’t want to take chances :-/

I was missing a C …

I have created five content types for H5P so far: Agamotto, Bingo (should be released shortly), Dictation, Essay and Juxtaposition. For some reason I noticed that those begin with A, B, D, E, and J — so it felt natural that my sixth content type should begin with a C to close one of the gaps 😉 Here it is …

Say hello to H5P Cornell Notes

I felt that the H5P content type family might need a new member that can help students with synthesizing and applying their knowledge. Well, that’s where Cornell notes may come in handy, and now you can provide a text, a video or an audio file that students can study and that they can attach their notes to directly. It’s not a spectacular content type, but hopefully you can put it to good use.

On this site, the available width for the content is small, so you will have to use the button in the upper left corner to toggle between the exercise and the notes. If the host system provides enough space or if you go to fullscreen mode on this page, both the exercise and the notes can be displayed next to each other — which is a little more convenient.

If you’re using H5P on your own system, the notes can be saved and retrieved later, of course. In order for this to work, users have to be logged in however, and H5P’s save content state feature has to be enabled.

It’s still a beta version, and some things may change, but feel free to download this content demo and upload it to your system in order to play around with it before the final version arrives. If you want to peek at the source code, you can find it on github, of course. It’s open source software.

I know there are some features that you may feel are missing … Stay tuned for some more info on that!

Blockchain … disruptive … bingo!

It’s time for a new content type — or at least a demo version of it. It’s nothing super duper fancy. But it’s a little different than existing content types, because it doesn’t feature any kind of automated checking or feedback. So … huh … yeah … what is it good for? Absolutely nothing …

Nah, maybe it is good for something. If you know that you’re going to a boring conference (meeting, lecture, webinar, movie, … ), why not set up a nice game of buzzword bingo with H5P and share the link with other participants?!

A more “serious” approach could be to use it for ice breakers. Just prepare a bingo sheet that goes like this: “Find someone who …” and then list a bunch of attributes such as “listens to podcasts regularly”, “wears green socks” or “had to travel more than 10 kilometers today” – and let people get a bingo …

Normal bingo works, too, of course. You can define a set of numbers or phrases or words, the size of the bingo board (3 to 7 columns and rows), put an optional image or video on top, and you can even set a joker in the center. Well, and that’s basically it. Oh, sure, the most important thing for so many people: Yes, I’ll probably also add some options for visual styling such as changing the colors 😉

Of course, this might become more entertaining when the multiplayer API for H5P is ready one day, but maybe this is already useful for some of you 🙂

Feedback and suggestions are welcome as always! In what kind of scenarios could you use this content type? What should be improved?

Feel free to download this content to play with the demo or to have a look at the source code on github. If it’s worth a coffee, check out my Patreon page.