Download Preview Buttons for Website

How to Add responsive Buttons on Blogger or Website

Everyone can easily make a responsive buttons on blogger. Download, preview, subscribe buttons using a simple css and html code (just two codes). We explain it as simple as it can be. Copy css code and paste it in advanced css. This post is shared by Hindimart.in blog.

CSS Code

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
.btn {
  background-color: Red;
  border: none;
  color: white;
  padding: 5px 25px;
  cursor: pointer;
  font-size: 15px;
}
/* Darker background on mouse-over */
.btn:hover {
  background-color: Black;
}
</style>(code-box)

Hope, you copied the above css code. Now follow the few steps login your blogger account. After login click on THEME as shown in below image. Then click CUSTOMIZE and find advance css.

Download Button Steps

After clicking on customize go to Advanced and click on Add CSS and paste copied code. And go to to display buttons.

CSS Code Apply Steps

Now copy buttons code and go to posts and paste inside <> HTML view where you want to display buttons.

Buttons Code

<center><a href="#"><button class="btn"><i class="fa fa-download"></i> Download</button></a>&nbsp;&nbsp;&nbsp;<a href="#"><button class="btn"><i class="fa fa-eye"></i> Preview</button></a></center>(code-box)

Copy above html code and paste in blogger where you want to display buttons in blogger. Replace # link with your link (like https://www.hindimart.in). 

Final Buttons Preview

Download and Preview Buttons using CSS + HTML

Conclusion: Finally you came to know that how to make or create responsive download or preview buttons for blogger website. If you wish to read more articles go to Hindimart.in