How to Make Responsive Download Buttons on Blogger

Hindimart.in
0

How to add Responsive Download Buttons on Blogger

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 html 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

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

preview download buttons

Read More: Blogger Template Installation Guide

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

Post a Comment

0 Comments
* Please Don't Spam Here. All the Comments are Reviewed by Admin.
Post a Comment (0)
Our website uses cookies to enhance your experience. Learn More
Accept !