Multiple Time Download Button

अगर आप फुल्ली ऑटोमैटिक Download बटन बनाना चाहते हो व भी timer के साथ तो हम आपकी सहायता कर सकते है। क्योकि आपको इस प्रकार का article वैबसाइट पर कहीं भी नहीं मिलेगा जिसमे आपको ऑटो download button व भी टाइम के साथ मिल जाये ना ही आपको इस प्रकार की यूट्यूब पर विडियो मिलने वाली है हमारे अलावा

Download code click here

👇

Get Code

यह भी देखे:- Disable Copy Paste content from web page using CSS on blogger | Google Blogger Website (ब्लॉगर वैबसाइट से content को कॉपी होने से रोके)

विडियो को देखे 

Step 1. सबसे पहले आपको एक नया पेज बनाना है। 

• उस पेज मे आपको इस दिये गए कोड़ को पेस्ट कर देना है
• इसमे आप download बटन के साथ ads उपर और नीचे दोनों स्थान पर लगा सकते हो।

    <center>

        <!--- paste ads code here-->
        <button id="download-btn" onclick="generate()">
            Download Now
        </button>
        <div id="refresh" style="display: none; font-size: 18px;"><b>Thanks!</b><br /> Your download will start in
            few seconds... <br /> If not,</div>
        <a href="" id="re-download-btn" style="display: none;">Click here</a>
        <!--- paste ads code here-->
        <script>
            function generate() {
                var j = document.getElementById("refresh");
                var e, n = document.getElementById("re-download-btn"),
                    t = document.getElementById("download-btn"),
                    a = document.getElementById("re-download-btn").href,
                    l = 20,
                    d = document.createElement("span");
                n.parentNode.replaceChild(d, n),
                    e = setInterval(function () {
                        --l < 0 ? (d.parentNode.replaceChild(n, d),
                            clearInterval(e),
                            window.location.replace(a),
                            j.style.display = "contents",
                            n.style.display = "inline") : (d.innerHTML = "<div class='waiting'>Please Wait...</div><div class='timer'>" + l.toString() + "</div> <div class='second'>Seconds</div>",
                                t.style.display = "none")
                    }, 1e3)
            }
            document.getElementById("re-download-btn").href = localStorage.getItem("Download Link");
        </script>
    </center>

    <style>

        .timer {

            background: bisque;

            border-radius: 50%;

            width: 32px;

            padding: 20px;

            font-size: 25px;

        }

        button#download-btn {

            background: black;

            color: white;

            padding: 10px 15px;

            cursor: pointer;

            border-radius: 5px;

            border: none;

        }

        #download-btn:hover {

            background: red;

        }

    </style>

Step 2. नीचे दिये गए css कोड को आपको अपनी वैबसाइट के html section के head tag के नीचे पेस्ट कर देना है।

<style>
        .down-link a{
            background: black;
            color: white;
            padding: 10px 15px;
            cursor: pointer;
            border-radius: 5px;
            border: none;
            text-decoration: none;
            margin: 10px;        
        }
        .down-link a:hover {
            background: red;
        }
        /* if display buttion in table form*/ 
        /* .down-link a{
            display: table;     
        } */
    </style>

Step 3. नीचे दिये गए java script कोड को आपको अपनी वैबसाइट के html section के सबसे लास्ट में जहां body एंड होता है उस tag के ऊपर इस कोड पेस्ट कर देना है।

<script>
        var downlink = document.querySelectorAll(".down-link a");
        for (let i = 0; i < downlink.length; i++) {
            const dlink = downlink[i];
            downlink[i].addEventListener("click", function () {
                localStorage.setItem("Download Link", dlink.ping)
            });
        } 
</script>

Step 5. इसके बाद जब भी आप एक पोस्ट बनाते हो जिसमे आपको Download बटन देना होता है 

• उस पोस्ट मे इसे कोड़ को जरूर डाले तथा अगर आप इसके उपर नीचे ads कॉड भी लगा सकते हो
• ping="#"  में # की जगह आपको जिसको download  करवाना है उसका लिंक डाल देना है। 
• href="#" में # के स्थान पर आपको उस पेज का लिंक डालना है जो आपने बनाया है।

<center>
        <div class="down-link">
            <a href="#" ping="#">Download Now</a>
            <a href="#" ping="#">Download Now</a>
            <a href="#" ping="#">Download Now</a>
            <a href="#" ping="#">Download Now</a>
        </div>
  </center>

example के लिए आप कोड Download करके देखे

👇

Download Now