CSS Code (For Head Tag):
<style>
/* countdown time redirect button css */
#redirect-download{
padding: 10px 25px 10px 25px;
border: none;
border-radius:5px;
color: white;
background: dodgerblue;
font-weight: 600;
}
#redirect-download:hover{
background:royalblue;
}
</style>
JAVA Script (For Footer/Body Tag):
<script>
document.getElementById("post-Title").innerHTML = document.getElementById("postTitle").innerHTML;
var postTitle = document.getElementById("postTitle").innerHTML;
function redirectbtn(){
localStorage.setItem("Post Title", postTitle)
localStorage.setItem("Download Link",link);
return false;
}
</script>
HTML Code for Posts:
<center> <!-- Google Adsense Code--> <h2 style="margin: 0px;">Download<span id="post-Title"></span></h2> <form action="Page Download Link" target="_blank" style="margin-bottom: 15px;"> <button id="redirect-download" onclick="redirectbtn();"><i class="fa fa-download"></i> Download Now</button> </form> <!-- Google Adsense Code--> </center> <script> // download link paste here var link = "Download Link"; </script>
New Page Code:
<center> <!--Google Adsense Code--> <br> <center> <style>#postTitle{text-align: center;}</style> <button id="download-btn" onclick="generate()"> <i class="fa fa-download"></i> 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 then,</div> <a href="" id="re-download-btn" style="display: none;">Click Here</a> <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 = 5, 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) } </script> <style> button#download-btn { padding: 10px 25px 10px 25px; border: none; border-radius: 5px; color: white; background: dodgerblue; font-weight: 600; } button#download-btn:hover { background: royalblue; } .timer { background: bisque; width: 5%; padding: 10px; font-size: 25px; border-radius: 50%; width: 7%; } </style> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"></link> <script> document.getElementById("re-download-btn").href=localStorage.getItem("Download Link"); document.getElementById("postTitle").innerHTML = localStorage.getItem("Post Title"); </script> </center> <br><br> <!--Google Adsense Code--> </center>