How To Make Qr Code Generator Website With Blogger
Assalamu Alaikum. Welcome to another new post on Triknew. I am swapon with you, hope everyone is doing well. Friends today we will create a new qr code generate website for free with useing blogger. That is Qr Code Generator website. QR code is a 2-dimensional barcode or (2D barcode) which is used to collect and transmit data. The data in QR code is various types of information, such as URL, any text, any mobile number, email, address, and many more. Creating and scanning Qr code is very easy. It is a pattern like a small box, the box is made of black and white colors.
Qr code data is encoded in a characteristic pattern that can be easily read when scanned with a scanner camera. If you scan a QR code, you can see the information on the QR code contains. It is also an easy way to share digital data, URL, any code, or any information can be shared easily using Qr Code.
Best 5 Advantages Of Using QR Code:
- Easy To Use: QR code scanning is very easy, as a result of you can easily scan Qr Code and view any information very quickly.
- Storing Information Permanently: using QR code, you can store any information for many days or permanently for months or years, it will not change any of your information.
- Link Facility: QR code can be used to link any website, application, social media page, phone number etc. Through this link users, friends or users can easily connect with you.
- Usage In Payment System: QR code is used in various online payment technologies, through users can make online payments very easily.
- Information Sharing: Scan any important file, photo, video etc through QR code and share easily.
So guys what is QR code? I told details about the use of QR Code. So let’s go to the main topic of our post, how to build a QR Code generator website for free in the blogger.
Friends I showed in a previous post how to build a free website with the blogger. You will see that post. Then build a free website in the blogger. Now you enter your free blogger website.
Then click on the Three-Dot menubar on top of the left.
Now click on the ❝Page option❞ from the bottom. Then click on the (+) icon from the bottom.
Now click on the post option box and view the HTML View.
Copy Script From Here –
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR Code Generator</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
}
.container {
margin: 20px auto;
max-width: 600px;
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
}
#qrcode {
margin-top: 20px;
}
#download-link {
display: none;
margin-top: 10px;
}
</style>
</head>
<body>
<div class="container">
<h1>QR Code Generator</h1>
<label for="text-input">Enter Text:</label>
<input type="text" id="text-input" placeholder="Enter text...">
<button id="generate-button">Generate QR Code</button>
<div id="qrcode"></div>
<a id="download-link" download="qrcode.png">Download QR Code</a>
</div>
<script src="https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script>
<script>
const generateButton = document.getElementById('generate-button');
const textInput = document.getElementById('text-input');
const qrCodeContainer = document.getElementById('qrcode');
const downloadLink = document.getElementById('download-link');
generateButton.addEventListener('click', () => {
const text = textInput.value;
if (text) {
qrCodeContainer.innerHTML = '';
downloadLink.style.display = 'none';
const qrCode = new QRCode(qrCodeContainer, {
text: text,
width: 200,
height: 200,
});
const canvas = qrCodeContainer.querySelector('canvas');
if (canvas) {
const dataURL = canvas.toDataURL('image/png');
downloadLink.href = dataURL;
downloadLink.style.display = 'block';
}
}
});
</script>
</body>
</html>
Copy the Script From Box and paste here.
Once the codes are pasted, publish the click page on the aeroplane icon.
So friends, let’s view the page now. Friends, we have successfully created a Qr Code Generate website for free in just 2 minutes.
So let’s see now. The website can really convert any information or written text to Qr Code! So friends see our website is working successfully. The website we created generated our live Qr Code successful.
So friends, this was our post today, how to make Qr Code Generate website for free with Blogger? Hope the post will be helpful for you. I’m leaving here for today, see you in the next post with something new. Until then everyone stay well stay healthy and stay with TrickNew.
