Demo and Download Button with an Icon in Blog Posts.

This time I will share a tutorial on how to install the demo and download Button with an awesome icon on the Blogger Blog post.
Actually, before I have explained a lot about how to make a demo / result button on the previous post with a variety of views or effects, but on this occasion I made it with a different and simpler look, namely with an awesome font icon on the right.
This time I made it side by side ie on the left and right, with the reason that it looks more presentable. This button can also be replaced at will you, for example change it with the visit, buy, result and the like according to your own wishes.

How to Make a Demo and Download Button with an Icon in Blog Posts.

1. Login to your Blogger > select the Theme menu > then Edit HTML

2. Put next code right above the code ]]></b:skin> or </style>

@charset "UTF-8";
#wrap {
  margin:20px auto;
  text-align:center;
}

#wrap br { display:none; }

.button.left {
  display:inline-block;
  position:relative;
  font-family:'Source Sans Pro',Helvetica,sans-serif;
  background:#fb7073;
  padding:10px 30px;
  font-size:14px;
  margin:0 3px;
  color:#fff !important;
  border-radius:1px;
  border:none;
  text-transform:uppercase;
  text-decoration:none;
}

.button.right {
  display:inline-block;
  position:relative;
  font-family:'Source Sans Pro',Helvetica,sans-serif;
  background:#1b1b1b;
  padding:10px 30px;
  font-size:14px;
  margin:0 3px;
  color:#fff !important;
  border-radius:1px;
  border:none;
  text-transform:uppercase;
  text-decoration:none;
}

.button i {
  margin-left:15px;
  font-weight:normal;
  font-family:FontAwesome;
}

3. If you are done select Save Theme

4. To apply the demo and download button in your blog post > Create a New Post > select the HTML menu (not Compose) > then enter this code in it.

<div id="wrap">
<a class="button left" href="YOUR URL" rel="nofollow" target="_blank">RESULTS<i class="fa fa-search"></i></a>
<br />
<a class="button right" href="YOUR URL" rel="nofollow" target="_blank">DOWNLOAD<i class="fa fa-download"></i></a>
</div>
<div class="clear">
</div>

5. Next, just press Publish

CODE	Description
YOUR URL	Replease with your Link/URL
RESULTS	Change the text to your liking (for example: buy, demo, view or visit)
DOWNLOAD	Change the text to your liking (for example: buy, demo, view or visit)
fa fa-search	Change the Icon from Font Awesome (for example: fa fa-link)
fa fa-download	Change the Icon from Font Awesome (for example: fa fa-folder)

DEMO