Phim Mỹ

[phim my][bleft]

Phim ấn độ

[phim an do][grids]

Phim hài

[phim hai][twocolumns]

Phim hàn quốc

[phim han quoc][bsummary]

Seo wordpress

[wordpress][bsummary]

Kiếm tiền online Code tạo nút bán hàng cực đẹp cho blogspot

Bài viết liên quan: Đi đây đó

Kiếm tiền online

Tạo web bán hàng online trên blogspot

Xin chào các bạn đang kiếm tiền online bằng cách làm web blogspot hay bán hàng trên blogspot. Hôm nay phim mỹ sẽ chia sẽ cho các bạn code tạo nút (buttom) đăng ký, xem thêm hay nút bán hàng cực đẹp cho blogspot.

kiem tien online, kiếm tiền online, kiếm tiền trên blogspot, tạo web bán hàng miễn phí


Đây là các buttom được làm từ hiệu ứng CSS3, từ đoạn code này các bạn có thể sáng tạo ra nhiều loại buttom khác nhau cho phù hợp với nhu cầu và blog của bạn.

Tạo nút Demo và Download cho bài viết blog bằng slider cực kỳ đẹp và hấp dẫn, nút download và demo cho bài viết blogspot, khi bạn click vào nút download thì sẽ hiển thị silder cực kỳ hấp dẫn Button download và demo cho bài viết, chia sẻ cho mọi người cách tạo nút DEMO và DOWLOAD trong bài viết blog với hiệu ứng slider.

Việc này thực hiện khá đơn giản, các bạn làm theo các bước sau nhé.

Đầu tiên các bạn mở Blogger lên --> html edit --> tìm thẻ </style> hoặc ]]></b:skin>
Và dán mã dưới đây vào trước hai thẻ trên và bấm Save (lưu lại).



<style type='text/css'>
#wrap{margin:20px auto;text-align:center}
#wrap br{display:none}
.btn-slide,.btn-slide2{position:relative;display:inline-block;height:50px;width:200px;line-height:50px;padding:0;border-radius:50px;background:#fdfdfd;border:2px solid #0099cc;margin:10px;transition:.5s}
.btn-slide2{border:2px solid #efa666}
.btn-slide:hover{background-color:#0099cc}
.btn-slide2:hover{background-color:#efa666}
.btn-slide:hover span.circle,.btn-slide2:hover span.circle2{left:100%;margin-left:-45px;background-color:#fdfdfd;color:#0099cc}
.btn-slide2:hover span.circle2{color:#efa666}
.btn-slide:hover span.title,.btn-slide2:hover span.title2{left:40px;opacity:0}
.btn-slide:hover span.title-hover,.btn-slide2:hover span.title-hover2{opacity:1;left:40px}
.btn-slide span.circle,.btn-slide2 span.circle2{display:block;background-color:#0099cc;color:#fff;position:absolute;float:left;margin:5px;line-height:42px;height:40px;width:40px;top:0;left:0;transition:.5s;border-radius:50%}
.btn-slide2 span.circle2{background-color:#efa666}
.btn-slide span.title,.btn-slide span.title-hover,.btn-slide2 span.title2,.btn-slide2 span.title-hover2{position:absolute;left:90px;text-align:center;margin:0 auto;font-size:16px;font-weight:bold;color:#30abd5;transition:.5s}
.btn-slide2 span.title2,.btn-slide2 span.title-hover2{color:#efa666;left:80px}
.btn-slide span.title-hover,.btn-slide2 span.title-hover2{left:80px;opacity:0}
.btn-slide span.title-hover,.btn-slide2 span.title-hover2{color:#fff}
</style>


Cách tạo button Demo và Download trong bài đăng

Sau khi đã làm các bước trên , mỗi khi đăng bài và các bạn sử dụng hai button Demo và Dowload, hoặc tùy ý các bạn chỉnh sửa thì các bạn sẽ đăng bài như bên dưới.

Mở bài đăng mới lên -> soạn thảo chế độ html và dán mã sau vào.


<div id="wrap">
<a href="http://www.phimmy.met" class="btn-slide" target="_blank">
  <span class="circle"><i class="fa fa-rocket"></i></span>
  <span class="title">Demo</span>
  <span class="title-hover">Click here</span>
</a>
<a href="http://www.phimmy.net/search/label/kiem%20tien%20tren%20youtube" class="btn-slide2" target="_blank">
  <span class="circle2"><i class="fa fa-download"></i></span>
  <span class="title2">Download</span>
  <span class="title-hover2">Click here</span>
</a>
</div>

Nhớ thay link bên trên sao phù phù hợp


loading...
l

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