HTML İle QR Kod Oluşturma Sayfası

Basit bir şekilde anlatmak gerekirse aşağıda vereceğim HTML sayfası ile elinizdeki URL yi girerek QR kod oluşturabilirsiniz. QR kod taratıldığında da girmiş olduğunuz URL yi görebilirsiniz.             QR Kod Oluşturucu     ...

Başlatan: Kerem - Güncelleme: 13 Aralık 2023, 22:27:41 - Gösterim: 116

« önceki - sonraki »

0 Üyeler ve 1 Ziyaretçi konuyu incelemekte.

13 Aralık 2023, 22:27:41 Son düzenlenme: 14 Aralık 2023, 07:45:42 Kerem
HTML İle QR Kod Oluşturma Sayfası


Basit bir şekilde anlatmak gerekirse aşağıda vereceğim HTML sayfası ile elinizdeki URL yi girerek QR kod oluşturabilirsiniz. QR kod taratıldığında da girmiş olduğunuz URL yi görebilirsiniz.


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>QR Kod Oluşturucu</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            margin: 20px;
        }

        h1 {
            color: #333;
        }

        label {
            display: block;
            margin-top: 10px;
        }

        input {
            width: 300px;
            padding: 8px;
        }

        button {
            padding: 10px;
            background-color: #4CAF50;
            color: white;
            border: none;
            cursor: pointer;
        }

        button:hover {
            background-color: #45a049;
        }

        #qrcode {
            margin-top: 20px;
        }
    </style>
    <script src="https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script>
</head>
<body>

    <h1>QR Kod Oluşturucu</h1>

    <label for="urlInput">URL:</label>
    <input type="text" id="urlInput" placeholder="URL girin">

    <button onclick="generateQR()">Oluştur</button>

    <div id="qrcode"></div>

    <script>
        function generateQR() {
            var urlInput = document.getElementById("urlInput").value;
            var qrcode = new QRCode(document.getElementById("qrcode"), {
                text: urlInput,
                width: 128,
                height: 128
            });
        }
    </script>

</body>
</html>

Örnek Görsel:
Screenshot_2023-12-14-00-30-32-051_com.android.chrome-edit.jpg
  (304.95 KB , 1080x1914 - Gösterim: %1$d 27 .)
Kerem imza


Deli tarafıma denk gelmeyin, zira orada ben bile hükümsüzüm...

Benzer Konular (5)

Clicky