jQuery ClassyQR

Usage

First you need to include the jQuery library, since ClassyQR is a plugin. You can download it from the jQuery website or link it directly from the Google CDN.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

Secondly, you need to include the jQuery ClassyQR javascript file into your page. You can do it by adding the code below to your page.

<script src="js/jquery.classyqr.js"></script>

Now, you have two possibilities of embedding a QR code.

1. Create the image tag that will be replaced with the QR code image.

<img src="#" id="qr1" alt="" />

For the last part you activate the ClassyQR() function on the element you just created, so, we trigger the function on the image with the id qr1.

$("#qr1").ClassyQR({
    type: 'text',
    text: 'This is the text to embed'
});

2. Add a div with a specific id to your page, for example :

<div id="qr2"></div>

We trigger the function on the div with the id qr2 AND we add the create: true option, which signals the library to create the image tag inside the container div.

$("#qr2").ClassyQR({
    create: true,
    type: 'text',
    text: 'This is the text to embed'
});

Usage

size - size of the QR code. Can be omitted, default is 230.

encoding - encoding of the QR. Can be omitted, could be one of: UTF-8/Shift_JIS/ISO-8859-1, default is UTF-8

type - QR type. Can be: text/url/sms/email/call/location/wifi/contact, default is text

create - if the plugin will create an image tag inside the container or just replace the src of an already existing image tag. Can be true or false, default is false.

text - the text to encode in the QR. Only needed for text, email or sms QR codes.

number - the phone number if you want to create a sms or call QR code.

email - the email address in case you want to create an email QR code.

subject - the subject in case you want to create an email QR code.

latitude - the geographical latitude for the geolocation QR code.

longitude - the geographical longitude for the geolocation QR code.

address - the home address in case you want to create a contact QR code.

name - the name of the person in case you want to create a contact QR code.

url - the URL address in case you want to create an url or contact QR code.

alt - the alt code for the created/replaced image. Can be omitted.

note - a note in case you want to create a contact QR code.

Demo

Creates a simple text QR code with the default options.

Creates a call QR code, that your visitors can use to call your phone number.

Creates a geolocation QR code.

Creates a email QR code, that your visitors can scan and send you an email to the specified address.

Creates a sms QR code, that your visitors can scan and send you an SMS.

Creates a url QR code, that your visitors can scan and go to a specified address.