❤ CÁCH TẠO NÚT DEMO DOWNLOAD BUTTON CHO BLOGGER WORDPRESS, WEBSITE ĐẸP GỌN NHẸ ❤

A. HƯỚNG DẪN CÁCH TẠO NÚT DEMO DOWNLOAD CHO BLOGGER, WORDPRESS, WEBSITE: Có rất nhiều cách tuy nhiên cách nào nhanh đơn giản , loading trang nhanh mình tổng hợp và hướng dẫn các bạn bằng kinh nghiệm của mình thì đẹp và nhanh tiện lợi là yếu tố quan trọng cho web blog của các bạn các bạn có thể thêm tiện ích này cho tất cả các nền tảng blogspot, blog wordpress, website của bạn.
TỔNG HỢP CÁCH TẠO NÚT DEMO DOWNLOAD BUTTON CHO BLOGGER WORDPRESS, WEBSITE ĐẸP GỌN NHẸ # 20

TỔNG HỢP CÁCH TẠO NÚT DEMO DOWNLOAD BUTTON CHO BLOGGER WORDPRESS, WEBSITE ĐẸP GỌN NHẸ # 20

B. THỰC HÀNH HƯỚNG DẪN CÁCH TẠO NÚT DEMO DOWNLOAD CHO BLOGGER
Tạo nút Demo và Download cho bài viết blog bằng slider cực kỳ đẹp và hấp dẫn, nút download và demo cho bài viết blogspot, khi bạn click vào nút download thì sẽ hiển thị silder cực kỳ hấp dẫn Button download và demo cho bài viết, chia sẻ cho mọi người cách tạo nút TẢI, DEMO và DOWLOAD trong bài viết blog với hiệu ứng slider.
1. CÁCH 1: Cách tạo button Download, Demo cho blogger.

Đầu tiên các bạn mở Blogger lên --> html edit --> tìm thẻ </style> hoặc ]]></b:skin>
Và dán mã dưới đây vào trước hai thẻ trên và bấm Save (lưu lại).

 #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;
}

Cách tạo button Demo và Download trong bài đăng Sau khi đã làm các bước trên , mỗi khi đăng bài và các bạn sử dụng hai button Demo và Dowload, hoặc tùy ý các bạn chỉnh sửa thì các bạn sẽ đăng bài như bên dưới. Mở bài đăng mới lên -> soạn thảo chế độ html và dán mã sau vào.

Demo Click here Download Click here

Mang đi đâu nhớ ghi nguồn tại TRIỆU XUÂN ĐÔNG BLOG nhé!
Cái gì cũng có cái giá của nó. Tôn trọng người khác, người khác sẽ tôn trọng lại bạn!

BLOGGER SEO THUTHUATBLOG WORDPRESS

ADMIN: DREY

Nếu bạn không đẹp trai, không giàu có thì hãy cố gắng kiếm tiền. Thành công sẽ đến với bạn!!!