{"id":72626,"date":"2024-08-22T21:25:19","date_gmt":"2024-08-22T19:25:19","guid":{"rendered":"https:\/\/musiveo.com\/?page_id=72626"},"modified":"2025-08-19T13:05:56","modified_gmt":"2025-08-19T11:05:56","slug":"qr-code-generator","status":"publish","type":"page","link":"https:\/\/musiveo.com\/qr-code-generator\/","title":{"rendered":"QR Code Generator"},"content":{"rendered":"\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"--col-width:100%;flex-basis:100%\">\n<h2 class=\"wp-block-heading has-text-align-center\">QR Code Generator<\/h2>\n\n\n\n<p class=\"has-text-align-center wp-block-paragraph\">Generate QR Codes to any link for free. Copy and Paste your link below.<\/p>\n\n\n    <div id=\"qr-code-generator-wrapper\">\r\n        <div class=\"qr-code-generator\">\r\n            <input type=\"text\" id=\"qr-url\" placeholder=\"Enter URL\">\r\n            <button id=\"generate-qr\">Generate QR Codes<\/button>\r\n            <div class=\"qr-codes-grid\">\r\n                <div class=\"qr-code-item\">\r\n                    <div id=\"qr-code-container-bw\"><\/div>\r\n                    <button class=\"download-qr\" data-container=\"qr-code-container-bw\" data-filename=\"qrcode_normal.png\">Download Normal QR Code<\/button>\r\n                <\/div>\r\n                <div class=\"qr-code-item\">\r\n                    <div id=\"qr-code-container-bw-dark\"><\/div>\r\n                    <button class=\"download-qr\" data-container=\"qr-code-container-bw-dark\" data-filename=\"qrcode_dark.png\">Download Dark QR Code<\/button>\r\n                <\/div>\r\n                <div class=\"qr-code-item\">\r\n                    <div id=\"qr-code-container-color\"><\/div>\r\n                    <button class=\"download-qr\" data-container=\"qr-code-container-color\" data-filename=\"qrcode_color.png\">Download Colored QR Code<\/button>\r\n                <\/div>\r\n                <div class=\"qr-code-item\">\r\n                    <div id=\"qr-code-container-color-dark\"><\/div>\r\n                    <button class=\"download-qr\" data-container=\"qr-code-container-color-dark\" data-filename=\"qrcode_color_dark.png\">Download Colored Dark QR Code<\/button>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n    <script>\r\n    document.addEventListener('DOMContentLoaded', function() {\r\n        console.log(\"DOM fully loaded and parsed\");\r\n\r\n        var generateButton = document.getElementById('generate-qr');\r\n        var urlInput = document.getElementById('qr-url');\r\n\r\n        if (!generateButton || !urlInput) {\r\n            console.error(\"Required elements are missing in the DOM.\");\r\n            return;\r\n        }\r\n\r\n        generateButton.addEventListener('click', function() {\r\n            console.log(\"Generate button clicked\");\r\n\r\n            var url = urlInput.value;\r\n\r\n            if (!url) {\r\n                alert(\"Please enter a URL\");\r\n                return;\r\n            }\r\n\r\n            console.log(\"Generating QR codes for URL:\", url);\r\n            generateQRCodes(url);\r\n        });\r\n\r\n        function generateQRCodes(url) {\r\n            generateQRCode('qr-code-container-bw', url, \"#000000\", \"#ffffff\");\r\n            generateQRCode('qr-code-container-bw-dark', url, \"#ffffff\", \"#000000\");\r\n            generateQRCode('qr-code-container-color', url, \"#7f11cb\", \"#ffffff\");\r\n            generateQRCode('qr-code-container-color-dark', url, \"#ffffff\", \"#7f11cb\");\r\n        }\r\n\r\n        function generateQRCode(containerId, url, colorDark, colorLight) {\r\n            var container = document.getElementById(containerId);\r\n            container.innerHTML = '';\r\n            try {\r\n                new QRCode(container, {\r\n                    text: url,\r\n                    width: 256,\r\n                    height: 256,\r\n                    colorDark: colorDark,\r\n                    colorLight: colorLight\r\n                });\r\n                console.log(\"QR code generated for container:\", containerId);\r\n            } catch (error) {\r\n                console.error(\"Error generating QR code:\", error);\r\n                alert(\"Failed to generate QR code. Please try again.\");\r\n            }\r\n        }\r\n\r\n        function downloadQRCode(container, filename) {\r\n            var canvas = container.querySelector('canvas');\r\n            if (canvas) {\r\n                var image = canvas.toDataURL(\"image\/png\").replace(\"image\/png\", \"image\/octet-stream\");\r\n                var link = document.createElement('a');\r\n                link.download = filename;\r\n                link.href = image;\r\n                link.click();\r\n            } else {\r\n                console.error(\"No canvas element found in container:\", container.id);\r\n            }\r\n        }\r\n\r\n        document.querySelectorAll('.download-qr').forEach(function(button) {\r\n            button.addEventListener('click', function() {\r\n                var container = document.getElementById(this.dataset.container);\r\n                var filename = this.dataset.filename;\r\n                downloadQRCode(container, filename);\r\n            });\r\n        });\r\n\r\n        if (typeof QRCode === 'undefined') {\r\n            console.error(\"QRCode library is undefined\");\r\n        } else {\r\n            console.log(\"QRCode library loaded successfully\");\r\n        }\r\n    });\r\n    <\/script>\r\n    \n<\/div>\n<\/div>\n\n\n\n<div style=\"height:200px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns ticss-251ddda0 is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column ticss-9d9d7ffe is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\">Ads<\/h3>\n\n\n\n<script async src=\"https:\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js?client=ca-pub-9774024126640231\"\n     crossorigin=\"anonymous\"><\/script>\n<ins class=\"adsbygoogle\"\n     style=\"display:block\"\n     data-matched-content-rows-num=\"1,1\"\n     data-matched-content-columns-num=\"1,4\"\n     data-matched-content-ui-type=\"image_stacked,image_stacked\"\n     data-ad-format=\"autorelaxed\"\n     data-ad-client=\"ca-pub-9774024126640231\"\n     data-ad-slot=\"4607491702\"><\/ins>\n<script>\n     (adsbygoogle = window.adsbygoogle || []).push({});\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/musiveo.com\/upgrade\/\" data-type=\"page\" data-id=\"3664\"><mark style=\"background-color:rgba(0, 0, 0, 0);color:#673bff\" class=\"has-inline-color\">Remove Ads with Musiveo Premium<\/mark><\/a><\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:100px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-8f761849 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\"><\/div>\n<\/div>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>QR Code Generator Generate QR Codes to any link for free. Copy and Paste your link below.<\/p>\n","protected":false},"author":496,"featured_media":72631,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"type":"single","auto_type":[false],"post":[""],"cover":[],"stream":[""],"stream_url":[""],"waveform_data":[[]],"duration":[0],"start":[0],"end":[0],"bpm":[0],"downloadable":[false],"download_url":[""],"purchase_title":[""],"purchase_url":[""],"post-count-all":[0],"like_count":[0],"download_count":[0],"editor_note":[""],"copyright":[""],"ai_generated":[],"captions":[[]],"sources":[[]],"color":[""],"hide_sidenav":false,"hide_pagenav":false,"hide_title":true,"hide_footer":false,"disable_player":false,"sidebar":0,"footer":0,"add_classes":"","cybocfi_hide_featured_image":"yes","no_ajax_leave":false,"no_ajax":true,"footnotes":"","hide_mobile_menu":false},"class_list":["post-72626","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/musiveo.com\/json\/wp\/v2\/pages\/72626","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/musiveo.com\/json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/musiveo.com\/json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/musiveo.com\/json\/wp\/v2\/users\/496"}],"replies":[{"embeddable":true,"href":"https:\/\/musiveo.com\/json\/wp\/v2\/comments?post=72626"}],"version-history":[{"count":0,"href":"https:\/\/musiveo.com\/json\/wp\/v2\/pages\/72626\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/musiveo.com\/json\/wp\/v2\/media\/72631"}],"wp:attachment":[{"href":"https:\/\/musiveo.com\/json\/wp\/v2\/media?parent=72626"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}