Author: Oliver

Posted on

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)…

If the latest version cannot be found on the H5P Hub …

Then just download one of the demo contents and upload it to your H5P enabled platform with administrative rights. That will install the new libraries from the file.

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: https://github.com/otacke/h5p-kewar-code .

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 :-/