Embed a QR Code reader on your website, plus using QR Codes for Self-checkout on mobile in libraries



I recently had an idea for my Library for self-checkouts using the customer's mobile phone instead of a self-checkout machine, or PC and scanner.

The idea was that the customer will use their mobile phone to scan a QR Code on their mobile phone using either an app or one built into their browser, which will then open a link to a Form, either from Google or Office365. The QR Code will be situated on the side of the shelf or somewhere visible for the customer to easily see with steps on how to check-out the book.

The Form will have the required details necessary for borrowing, such as:
  • The customer's name and/or barcode.
  • The title of the book.
  • The book's barcode with an example of where the barcode is located and how it should look like.
The form will then let the customer know that the form has been successfully submitted and an email will be sent to them with the due date once the loan enquiry has been processed, with how and where to return or renew the book before the due date.

The Forms, regardless if they are from Google or from Office365 will need settings or other apps to allow email alerts to be sent to the Library staff once a form has been filled. In Office365 the form will also need to be a Group form so it can be editable and results viewed by other people in the Library team.

The Form link can be shortened using Bit.ly or another URL shortener and added below the QR Code should the customer prefer to type in the link to the Form rather than use the QR Code reader.

(On a side note: Koha has a self-checkout module which can be used instead of the Form described above. However, one still needs to enter the barcode number of the book by hand if a scanner is not available.)

I was looking for a barcode reader using a mobile phone's camera which can be used instead of a barcode scanner. I found a couple of free ones on GitHub but none that I can just simply embed into a HTML website.

I did find a QR Code reader that can be embedded into a website which I tweaked slightly.

Here is the code which is provided as is without warranty:


You can try it out below or on my GitHub page

Here is a QR Code I randomly generated that you can use as an example.


Embedding a QR reader into the Library's website can encourage clients to scan the QR Code if they don't already have an app. 
The Library can do a range of things with QR Codes, such as to:
  1. Link to a book's online information, the book's audiobook version or other related reading material.
  2. View online YouTube videos or MP3 playlist.
  3. Go to a webpage on how to contact the Library.
  4. Send an email contacting Library staff.
  5. Google map with directions to the Library.
  6. Receive an SMS with an invite to a Library event.
  7. Do a virtual tour of Library.
  8. Link to other Library resources.
  9. Promote Library events.
  10. Link to surveys, contests, and other part of an exhibition.
  11. Link to an audio tour.
  12. Link to an artist's website.
  13. Link to book reviews.
Well, hope this has generated some ideas for using QR Codes in your Library!


Popular posts from this blog

How to make a chalkboard graphic for free

Search widgets

Make your own online library easily for free!