QR CODE Generator in SharePoint using JavaScript

In this SharePoint tutorial, we will discuss how to generate QR Code in SharePoint using JavaScript. We can generate QR code in SharePoint 2013/2016 and SharePoint Online using the same JavaScript code.

Create QR Code in SharePoint using JavaScript

Step 1: Login to the SharePoint site and create a new web part page in SharePoint

Step 2: Edit the SharePoint web part page -> Add a Script Editor Web part in the page

Step 3: Add the below code inside snip in the Script Editor WebPart -> Save the page.

<script src="/sites/DLH/SiteAssets/qr.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
function generatefn() {
if ($('#QR_URL').val() != '')
onLoadQrCode($('#QR_URL').val(), 'DivImage');
<input type="text" id="QR_URL" value="" style="width:250px" /><input onclick="generatefn()" type="button" id="btnGenerate" value="Generate" />
<div id="DivImage"></div>

You can download qr.sj file.

Step 4: Once you click on Save button, the Design page will appear here as below Image.

QR CODE Generator in SharePoint
QR CODE Generator in SharePoint

Step 5: Next Download the QR code scanner on your mobile and try to scan the code and see what happens here. Below is the result after scanning.

QR CODE Generator in SharePoint Online
QR CODE Generator in SharePoint Online

You may like following SharePoint tutorials:

Please try and put comments here if anyone facing any issue. Hope this SharePoint tutorial explains, how to generate QR code in SharePoint using JavaScript.

Donwload Hub site pdf

Download SharePoint Online Tutorial PDF FREE!

Get update on Webinars, video tutorials, training courses etc.

Rajkiran Swain

Rajkiran is currently working as a SharePoint Consultant in QATAR . Rajkiran having 7+ years of experience in Microsoft Technologies such as SharePoint 2019/2016/2013/2010, MOSS 2007,WSS 3.0, Migration, Asp.Net, C#.Net, Sql Server, Ajax, jQuery etc.He is C#Corner MVP (2 Times).