Author Archive | JD Thomas

At Computers in Libraries 2010 and for the upcoming Internet Librarian 2010 conferences we have provided links to the attendee blogger’s websites via QR Codes. We have discussed QR codes in the past here in a post called QR Brain Dump. That post links to a very comprehensive QR Code guide by Mark Sprague.

When I first implemented the codes in primitive days of early 2010 I actually created each graphic, stored it, and added them to posts and pages via normal html <img> tags. Jump ahead to this week and as I was setting up the bloggers page for Internet Librarian 2010 I had one of those AH HAH! moments when you realize you have been ‘doing it wrong’ all along.

In the last year the Google Charts API has both greatly expanded in functionality and received a lot of Google Love in the form of  better documentation and easy to use end-user tools to make using this powerful system easy for web developers.  The single biggest boons to end users have to be the Live Chart Playground for advanced users and the Chart Wizard for everyone else.

While a QR code is not a chart, per se, the Google Chart API can create URL QR codes as easily as it makes a pie chart.    You can use the Chart Wizard for this but after I break down a URL for you it may not be necessary.

This is the QR code for Polly-Alida Farrington’s pafa.net site.

pafa.net

I picked her’s because I messed it up on my first try yesterday.  She DM’d me on Twitter and let me know I had encoded it as http:///pafa.net.   That third slash was not desirable.

Before switching to this method, fixing it would have meant generating a new image, uploading it to the server or changing the page to point to the new image URL.

This time, all I had to do was remove the extra slash from the URL I use to embed the QR Code.

The URL looks like this:

It breaks down like this:

Chart API Base URL:  http://chart.apis.google.com/chart?
Specify Chart Type as QR Code: cht=qr
Specify Chart Size: &chs=200×200
Specify URL to Encode: &chl=http://www.pafa.net

So you can just save:
http://chart.apis.google.com/chart?cht=qr&chs=200×200&chl=

In your bag of tricks and tack on the URL you want to encode in realtime.  For regular use on a website this works fine.  If you need to store this in a database, JavaScript, or using a mechanism that may mangle the URL &chl= parameter you should encode it safely.

Using the above info you can adapt it so the URL is in this form:

This is needed on LibConf.com because I use the images in a Javascript based on-click event so they pop-up in the little windows on http://libconf.com/internet-librarian-resources/bloggers-at-il2010/.