Chủ Nhật, 30 tháng 8, 2015

Cách thêm nút Dowload và Demo vào bài viết Blogspot

Sau đây mình xin giới thiếu cách taoh nút demo và dowload cho mọi người ,phù hợp với những blog thủ thuật hay template blogspot :)
Cách thêm nút Dowload và Demo vào bài viết Blogspot
Cách thực hiện :
Vào blogspot ->  mẫu -> chỉnh sửa HMTL .Thêm đoạn code dưới đây trước thẻ </style>
.btn{list-style:none;text-align:center;margin:10px!important;padding:10px!important;font-size:14px;clear:both;display:inline-block;text-decoration:none!important;color:#FFF!important}
.btn ul {margin:0;padding:0}
.btn li{display:inline;margin:5px;padding:0;list-style:none;}
.demo,.download{padding:12px 15px!important;color:#fff!important;font-weight:700;font-size:14px;font-family:Open Sans,sans-serif;text-align:center;text-transform:uppercase;border-radius:3px;opacity:.95;border:0;letter-spacing:2px;transition:all .2s ease-out}
.demo {background-color:#3498DB;}
.download {background-color:#1ABC84;}
.demo:hover {background-color:#60B8F4;color:#fff;border-bottom:2px solid #3498DB; opacity:1;}
.download:hover {background-color:#49DDAA;color:#fff;border-bottom:2px solid #1ABC84;opacity:1;}
.demo:before {content:&#39;\f135&#39;;display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
.download:before {content:&#39;\f019&#39;;display:inline-block;font-weight:normal;vertical-align:top;margin-right:10px;width:16px;height:16px;line-height:24px;font-family:fontawesome;transition:all 0.5s ease-out;}
Chèn code dưới đây vào bài viết mà bạn muốn đặt nút dowload và demo
 <div style="text-align: center;">
<ul class="btn">
<li><a class="demo" href="YOUR-LINK-HERE" target="_blank">DEMO</a></li>
<li><a class="download" href=" YOUR-LINK-HERE" target="_blank">DOWNLOAD</a></li>
</ul>
</div>
Thay YOU R-LINK-HERE bằng Link Demo
Thay YOU-LINK-HERE bằng Link Dowload
Chúc bạn thành công !

Không có nhận xét nào:

Đăng nhận xét

Related Posts Plugin for WordPress, Blogger...