HTML to QR Code
Libraries and organizations have recently began to utilize Quick Response (QR) Codes in a number of ways.
- Displaying bibliographic data
- Hardlinks to news/info/ad pages
- Contact information
With Google’s Chart API, and more specifically their QR Codes Feature, it’s easy to generate QR Codes populated with existing HTML content via JavaScript.
In order to generate a QR code using the chart tools, just plug in a chart type, specified size parameters and a string of text into a url. View QR code parameters overview.
Below is an example of generating a QR code from a few HTML elements. Note that each element is uniquely identified in order to easily grab the element’s contents programmatically.
The first section of the script is where we grab the HTML element’s content and set to the variables title, author and location. These variables will join together to create our QR code content, seen here as qr_content. In the next section we build our API url. I broke up the url into sections in order to better display the url’s parameters. To save some time you can just build the url into a single string as I did in the comment section under the qr_img_url declaration.
Comment bellow if you have any questions or suggestions.
