Adding QR Codes to the Catalog

(Ex Libris Voyager)

This handout will cover two different ways that QR codes can be added to the Ex Libris Voyager catalog. Below is a screen shot of the Action Box that appears in Georgetown College’s catalog (https://voyager.georgetowncollege.edu).

As you can see from the highlighted areas, a large QR code is displayed in the Action Box that once scanned will link users to that particular holdings record. The other feature is the ‘Get Info in a QR Code.’ When a user clicks on this option and additional window opens with a QR code displayed which displays the title, call number, and location once it is scanned. The first one that this handout will cover is the large QR Code.

Large QR Code

To have the large QR code displayed in the Voyager catalog there is only one file that needs to be edited. That file is the displayFacets.xsl file (/m1/voyager/xxxdb/tomcat/vwebv/context/vwebv/ui/en_US/xsl/pageFacets/displayFacets.xsl).

In this file you will need to add three different pieces of coding. First in the top of the file under

<xsl:include href="../local_googleBooksAvail.xsl"/> (or the last line of code in this section if you have made any additions) add the following piece of code:

<xsl:variable name="bibId" select="//@bibId"/>

<!-- QR Code -->

<xsl:variable name="qrCode">http://qrcode.kaywa.com/img.php?s=5&amp;d=http%3A%2F%2F[YOUR_URL]%2Fvwebv%2FholdingsInfo%3FbibId%3D<xsl:value-of select="$bibId"/</xsl:variable>

<!-- End QR Code -->

The highlighted section is where you would add the URL for your library’s catalog.

Next, find the following section of code:

<xsl:for-each select="page:element[@nameId='actionBox.actions.group']">

<div class="actions">

<label<xsl:value-of select="page:label"/</label>

<h2 class="nav">Action Navigation</h2>

<ul title="Action Navigation" class="actions">

<xsl:for-each select="page:element">

<li<span class="recordLinkBullet">·</span<a href="{page:URL}"<span<xsl:value-of select="page:linkText"/</span</a<br/<span class="fieldSubText"<xsl:value-of select="page:postText"/</span</li>

</xsl:for-each>

After you have located this section add the following code for the QR Code to appear:

<!-- QR Code Begin -->

<div style="float:left;width: 120px; text-align:center; border:3px solid #000;margin: 0 10px 00;padding:10px;" class="googleBooks"<b>QR code:</b<br/>

<img src="{$qrCode}" width="102" height="102" alt="qrcode" /<br /<a href="https://voyager.georgetowncollege.edu/qr.html" target="_new">What's this?</a>

</div>

<!-- QR Code End -->

The highlighted area links to additional webpage that explains to users what a QR code is, what is needed to read them, and how they are being used in the library catalog.

That’s it!! You should now see the QR code displayed in your catalog.

‘Get Info in a QR Code’

The ‘Get info in a QR Code’ feature is an adaptation of the SMS option by Paul Asay which can be found at this link http://paulasay.indstate.edu/textme/. For this feature you need to create a file and name it local_qrCode.xsl and edit the displayFacets.xsl file. Using Paul Asay’s callSearch.xsl file as a starting point, the file local_qrCode.xsl was created. This file will pull the information on the title, call number and location. Below is the coding for that file:

<?xml version="1.0" encoding="UTF-8"?>

<!--

** Product : WebVoyage : ISBN Link

** Version : 7.0

** Created : Dec-2008

** Orig Author : Paul Asay

** Edited by : Benjamin Rawlins to display a QR code

-->

<xsl:stylesheet version="1.0"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:page="http://www.exlibrisgroup.com/voyager/webvoyage/page"

xmlns:fo="http://www.w3.org/1999/XSL/Format">

<!-- ###################################################################### -->

<xsl:template name="recordCallQr">

<xsl:variable name="callnum">

<xsl:call-template name="BMDProcessMarcTags">

<xsl:with-param name="field" select="'050'"/>

<xsl:with-param name="indicator1" select="'X'"/>

<xsl:with-param name="indicator2" select="'X'"/>

<xsl:with-param name="subfield" select="'ab'"/>

<xsl:with-param name="mfhdID" select="$bibID"/>

<xsl:with-param name="recordType" select="'bib'"/>

</xsl:call-template>

</xsl:variable>

<xsl:variable name="callnum99">

<xsl:call-template name="BMD9000"/>

</xsl:variable>

<xsl:variable name="titlename">

<xsl:call-template name="BMDProcessMarcTags">

<xsl:with-param name="field" select="'245'"/>

<xsl:with-param name="indicator1" select="'X'"/>

<xsl:with-param name="indicator2" select="'X'"/>

<xsl:with-param name="subfield" select="'a'"/>

<xsl:with-param name="mfhdID" select="$bibID"/>

<xsl:with-param name="recordType" select="'bib'"/>

</xsl:call-template>

</xsl:variable>

<!-- Replaced Spaces with underscores in call number and title -->

<xsl:variable name="callnum2">

<xsl:value-of select="translate($callnum, ' ', '_')"/>

</xsl:variable>

<xsl:variable name="callnum992">

<xsl:value-of select="normalize-space(substring-before(substring-after($callnum99, 'Call Number:'),'Number of Items'))"/>

</xsl:variable>

<xsl:variable name="location">

<xsl:value-of select="substring-before(substring-after($callnum99, 'Location:'),'Call Number')"/>

</xsl:variable>

<xsl:variable name="titlename2">

<xsl:value-of select="translate($titlename, ' ', '_')"/>

</xsl:variable>

<xsl:if test="string-length($callnum99)">

<img src="/vwebv/ui/en_US/images/qrcode.png" border="0" style="vertical-align:middle; text-decoration:none;"/> <a target="_blank">

<xsl:attribute name="href">http://qrcode.kaywa.com/img.php?s=5&amp;d=<xsl:value-of select="$titlename2"/<xsl:text>%0D%0A</xsl:text> <xsl:value-of select="$location"/<xsl:text>%0D%0A</xsl:text>

<xsl:value-of select="$callnum2"/<xsl:text>%0D%0A</xsl:text>

</xsl:attribute>

Get info in a QR Code</a>

</xsl:if>

</xsl:template>

<!-- ###################################################################### -->

</xsl:stylesheet>

There is no editing required in this file. You can simply copy the contents and create your own local_qrCode.xsl file and place it into the proper location. Once you have created the file and place it in the following location /m1/voyager/ksudb/tomcat/vwebv/context/vwebv/ui/en_US/xsl/pageFacets, open the displayFacets.xsl file. You will need to add to pieces of code. First, under the following code:

<xsl:include href="../local_googleBooksAvail.xsl"/>

add the code to include the local_qrCode.xsl file. The following is the snippet of code you want to add

<xsl:include href="../local_qrCode.xsl"/>

After you add this line of code, find the following section of code:

<xsl:for-each select="page:element[@nameId='actionBox.actions.group']">

<div class="actions">

<label<xsl:value-of select="page:label"/</label>

<h2 class="nav">Action Navigation</h2>

<ul title="Action Navigation" class="actions">

<xsl:for-each select="page:element">

<li<span class="recordLinkBullet">·</span<a href="{page:URL}"<span<xsl:value-of select="page:linkText"/</span</a<br/<span class="fieldSubText"<xsl:value-of select="page:postText"/</span</li>

</xsl:for-each>

After this section add the following:

<div id="qrCode">

<xsl:call-template name="recordCallQr"/>

</div>

After you have added this code and saved your file you should see the ‘Get info in a QR Code’ located in the Action Box.