79
Advance Time Download Button with Safe Link
अगर आप अपनी वैबसाइट पर professional time download button लगाना चाहते हो तो आप नीचे दिये गए कोड का उपयोग करके बहुत ही अच्छा टाइम download button लगा सकते हो जिसमे आपकी वैबसाइट का download url लिंक भी safe रहेगा।
इसी के साथ आपको मे इस आर्टिकल के माध्यम से दो time डाउनलोड बटन बना कर दिखाऊँगा जो दोनों ही अलग अलग लूक मे रहेगा जो आपको अच्छा लगे आप उसका उपयोग कर सकते है
New Page Code
उसके बाद आपको एक न्यू page बनाना है वह पर नीचे दिये गए कोड को paste कर देना है। और ध्यान रहे page के title में safe जरूर लिखे और कुछ ना लिखे। इसके दो script टैग दिये गए है दोनों में से किसी एक को ही paste करें दोनों अलग अलग time download button है।
Page Style 1
CSS Code
<style>#download:hover {background: #3f51b5;opacity: 1}#download {background-color: #3f51b5;background-image: linear-gradient(to right, #3f51b5, #03a9f4);color: white;padding: 10px;font-size: 15px;font-weight: bold;border: none;border-radius: 3px;opacity: 0.9;transition: 0.3s;}#app {margin: auto;text-align: center;}.base-timer {position: relative;width: 80px;height: 80px;margin: auto;}.base-timer__svg {transform: scaleX(-1);}.base-timer__circle {fill: none;stroke: none;}.base-timer__path-elapsed {stroke-width: 10px;stroke: grey;}.base-timer__path-remaining {stroke-width: 10px;stroke-linecap: round;transform: rotate(90deg);transform-origin: center;transition: 1s linear all;fill-rule: nonzero;stroke: currentColor;}.base-timer__path-remaining.green {color: rgb(65, 184, 131);}.base-timer__path-remaining.orange {color: orange;}.base-timer__path-remaining.red {color: red;}.base-timer__label {position: absolute;width: 80px;height: 80px;top: 0;display: flex;align-items: center;justify-content: center;font-size: 25px;font-weight: bold;}.sapnaitgk, .sapnaitgk a {color: white;cursor: default;font-size: 10px;margin-top: -5px;}</style>
Page Code
<div id="app"></div><script>var TIME_LIMIT = 15;</script><script src="https://sapnaitgk.github.io/Blogger/animationtimebutton.js"></script>
Page Style 1
CSS Code
<style>.download-container{position: relative;display: flex;justify-content: center;align-items: center;flex-direction: column;}.download-btn{position: relative;background: #4285F4;color: #fff !important;width: 260px;padding: 18px 0;text-align: center;font-size: 1.3em;font-weight: 400;text-decoration: none;border-radius: 50px;box-shadow: 0 5px 25px rgba(1 1 1 / 15%);transition: background 0.3s ease;}.download-btn:hover{background: #1b57bd;text-decoration: none !important;}.download-btn i{margin-left: 5px;}.countdown{font-size: 1.1em;font-weight: 700;margin-bottom: 20px;}.countdown span{color: #0693F6;font-size: 1.5em;font-weight: 800;}.pleaseWait-text{font-size: 1.1em;font-weight: 600;display: none;}.direct-text{font-size: 1.1em;font-weight: 600;display: none;}.direct{color: #0693F6;font-weight: 600;text-decoration: none;}.direct{cursor: pointer;}.sapnaitgk, .sapnaitgk a{color: white;cursor: default;}</style>
Page Code
<script src="https://sapnaitgk.github.io/Blogger/timedownloadbtn.js"></script><script>timeLeft = 15;</script>
HTML Code
सबसे पहले आपको नीचे दिये गए script को अपनी ब्लॉगर वैबसाइट के </body> टैग के तुरंत ऊपर paste कर देना है।
<script src="https://sapnaitgk.github.io/Blogger/safelink.js"></script>
Article Code
- अब आपको जब भी किसी आर्टिक्ल में time download button लगाना हो तो a टैग में class="safe" डालकर आप टाइम download button create कर सकते हो।
- अगर tamplate के अनुसार अगर आपने a tag का पहले से ही class दिया हुआ है तो आपको multiple class भी दे सकते है जैसे class="button btn download safe" इस प्रकार से ।
अगर आपको वैबसाइट WordPress पर है तो यहा code work नहीं करेगा WordPress के लिए आपको pro कोड Download करना पड़ेगा
अगर आप source code download करना चाहते हो दो नीचे Download button के माध्यम से download कर सकते है जिसके लिए आपको नाम मांत्र का शुल्क पे करना होगा।