How To Add A Download Timer Button In Blogger?

In this Article, I will show you how you can add a Countdown download timer button to your Blogger Website.

Download timer button is helpful especially if you are running a blog where you are providing content related to downloading of files like Music, Apps, Software, eBooks, Scripts etc. In those types of Websites, people just land on the page, download the file and leave the page.

Therefore, it is very difficult to keep a visitor engaged on a webpage. Your bounce rate will increase as well as your dwell time will decrease. That’s why you need to implement a download timer button to keep the user waiting at least 20-30 sec before downloading the file.

In that way you can improve your SEO by sending a positive user experience signal to Google. So, let’s check how you can add the countdown timer button to your Blogger website.

Before proceeding further, I recommend you to take a backup of your Blogger theme file. So, in case if you make any mistake you can easily restore to the previous stage.

Steps to Add Download Timer Button in Blogger

To Add a download timer button in Blogger, follow the below steps.

Open the Blogger dashboard and click on the theme section.

Now click on the drop down menu in the right side of customize button and select the Edit HTML option.

Now Find the </body> tag and paste the CSS and JavaScript code just above it.

Now save the code and open the Blog post in HTML view. Then paste the HTML code and change your Download link and publish the blog post.

<div style="text-align: center;"><a class="button" id="Count_Time">Show Content</a> </div>
 <div id="Stop_Timer" target="_blank">
   <!-- Add your content here to show after the timer finish -->
<p>Click the Button Below to Download the File.<p/> 
<a class="button" href="#" >Download the File</a>
</div>

You can add the destination download link just by changing the File URL from # to the actual URL.

Now the download timer button is added to your Blogger website. After that you just need the last code whenever you want the download timer in blog post.

All the HTML, CSS, and JavaScript code is given in a txt file. Just download the file and use it in your website.

Download the Timer code

No need to paste the CSS and JavaScript code again.

If you don’t want to use the code in theme than you can copy all code and paste it directly in the blog post editor. Just switch to HTML view and paste the code.

Here note that you can change the download timer count down to 20 sec or 30 sec just by changing the value var counter = 9; . Here, 9 simply means 9 seconds.