Demo and Download botton Blogspot
Updated on June 28, 2016
Author: 4tipsvn
Bước 1: Các bạn chèn đoạn CSS sau lên trước thẻ ]]></b:skin>, thẻ này nằm trong Mẫu (Template), các bạn mở mẫu ra edit rồi tìm thẻ trên sẽ thấy. Chèn xong lưu mẫu lại
Bước 2: Chèn đoạn code sau vào bài viết, nơi mà các bạn muốn cái nút Demo và Download đó xuất hiện. Nhớ thay Link Download và Demo của các bạn nha!
 |
| Demo and Download Botton Blogspot |
/* CSS Simple Button Flat UI by 4TipsVn */ #wrap { margin:20px auto; text-align:center; } #wrap br { display:none; } .btn { display:inline-block; position:relative; font-family:'Source Sans Pro', Helvetica, sans-serif; background:#4CB04E; padding:6px 14px; font-size:14px; margin:0 3px; color:#fff!important; text-shadow: rgba(100, 100, 100, 0.34902) 0px 2px 3px;border-radius:3px; border:none; text-transform:uppercase; text-decoration:none; transition:all 0.3s ease-out;-webkit-box-shadow: 2px 0 7px rgba(0,0,0,.3);-moz-box-shadow:2px 0 7px rgba(0,0,0,.3);box-shadow:2px 0 7px rgba(0,0,0,.3)} .btn.down { background:#4CB04E; color:#fff!important; text-shadow: rgba(100, 100, 100, 0.34902) 0px 2px 3px;} .btn.down:hover,.btn.down:active,.btn:hover,.btn:active { background:#fc4f3f; color:#fff; } a.btn.down:hover,a.btn.down:active,a.btn:hover,a.btn:active { color:#fff; } .btn i { margin-left:10px; font-weight:normal; font-family:FontAwesome; }
Bước 2: Chèn đoạn code sau vào bài viết, nơi mà các bạn muốn cái nút Demo và Download đó xuất hiện. Nhớ thay Link Download và Demo của các bạn nha!
<center>
<div id="wrap">
<a class="btn down" href="http://origin-btemplate.blogspot.com/" rel="nofollow" target="_blank">Demo <i class="fa fa-paper-plane"></i></a>
<a class="btn down" href="https://www.mediafire.com/download/92c21sggzg4tp49" rel="nofollow" target="_blank">Download <i class="fa fa-file"></i></a></div>
</center>
Nhớ chèn nốt cái font Awesome lên sau thẻ <head> nếu template bạn chưa có nhé! Nếu có rồi thì thôi! Font ngay bên dưới.
<link href='http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>