How to Add Download Timer in Blogger and WordPress Post

In today’s article, we are going to talk about adding a Download Timer in Blogger & WordPress. And what is this & how can we use them? So we will know all these things in this article. So stay tuned in this article and know in full detail.

What is Download Timer?

Before knowing about Add Download Timer in Blogger and WordPress Post, we know about this Download Timer.

Read More: How To Remove Date From Blogger Post URL

So let me tell you that this is a process, there is a countdown of a certain time before downloading anything. This is what we call Download Timer.

Free Countdown Widget for Blogger

If you do blogging and your blog is on the Blogger platform. Also, your blog is a Downloading Blog. So you must have thought at some point in time that you should also earn some good money.

So for this bloggers use Download Timer. By using this, people will stay on your blog for the time you have decided. Due to this your Bounce Rate also remains in control.

Countdown Timer HTML Script

Let me tell you that this feature of the Download Timer is made through complete coding. HTML and JavaScript have been used in this feature.

If you see any online web development-related Tools or Widgets. Coding is very important in all things. Nowadays people of the code Sikh are earning a lot even sitting at home easily.

Download Timer in Blogger & WordPress

So even before this, I wrote an article on this Download Timer. But in that, I told about a script that used to get redirected as soon as the timer ended.

But today I am going to tell you about a new script. After the timer runs out, your Download Button will be seen After this you will download only after clicking on it.

The script that I told earlier used to work only on Blogger’s blog. But you can easily use this script on a WordPress website also.

How To Use Download Timer

  • Open your Blogger Dashboard
  • Create a new Post
  • Select your wanted place to add a download timer
  • Click the + icon and select the custom HTML
  • Copy the Download timer Script on the download file and paste the script into a custom HTML container.
<div dir="ltr" style="text-align: left;" trbidi="on">

<center>
<span id="countdown">You have to wait 15 seconds.</span></center>
<br />
<div style="text-align: center;">
<b>Download Countdown</b><br />
<a href="#" id="download_link" style="display: none;"><img src="https://codebarta.com/wcode/img/download-button.png" /></a>
<noscript>JavaScript needs to be enabled in order to be able to download.</noscript>
<script type="application/javascript">
(function(){
   var message = "%d seconds before download link appears";
   // seconds before download link becomes visible
   var count = 15;
   var countdown_element = document.getElementById("countdown");
   var download_link = document.getElementById("download_link");
   var timer = setInterval(function(){
      // if countdown equals 0, the next condition will evaluate to false and the else-construct will be executed
      if (count) {
          // display text
          countdown_element.innerHTML = "You have to wait %d seconds.".replace("%d", count);
          // decrease counter
          count--;
      } else {
          // stop timer
          clearInterval(timer);
          // hide countdown
          countdown_element.style.display = "none";
          // show download link
          download_link.style.display = "";
      }
   }, 1000);
})();
</script>
</div>
</div>
  • Now you have to paste your download link in place of # in this code.
  • Publish Your Post

How to add Download Timer WordPress website

  • Open your WordPress Admin Panel
  • Create a new Post
  • Select your wanted place to add a download timer
  • Click the + icon and select the custom HTML
  • Copy the Download timer Script on the download file and paste the script into a custom HTML container.
<div dir="ltr" style="text-align: left;" trbidi="on">

<center>
<span id="countdown">You have to wait 15 seconds.</span></center>
<br />
<div style="text-align: center;">
<b>Download Countdown</b><br />
<a href="#" id="download_link" style="display: none;"><img src="https://codebarta.com/wcode/img/download-button.png" /></a>
<noscript>JavaScript needs to be enabled in order to be able to download.</noscript>
<script type="application/javascript">
(function(){
   var message = "%d seconds before download link appears";
   // seconds before download link becomes visible
   var count = 15;
   var countdown_element = document.getElementById("countdown");
   var download_link = document.getElementById("download_link");
   var timer = setInterval(function(){
      // if countdown equals 0, the next condition will evaluate to false and the else-construct will be executed
      if (count) {
          // display text
          countdown_element.innerHTML = "You have to wait %d seconds.".replace("%d", count);
          // decrease counter
          count--;
      } else {
          // stop timer
          clearInterval(timer);
          // hide countdown
          countdown_element.style.display = "none";
          // show download link
          download_link.style.display = "";
      }
   }, 1000);
})();
</script>
</div>
</div>
  • Now you have to paste your download link in place of # in this code.
  • Publish Your Post

I hope this information is helpful to create your Download Timer Script on Blogger and WordPress Post. one more thing Please Share This Article And keep support on my Blog.

Leave a Comment