Hello xin chào các bạn đến hẹn lại lên mình xin chia sẻ cách làm nút button khi đăng bài viết cực đẹp cho Blogger tạo thêm sự hấp dẫn cho người xem và khiến họ hứng thú ghé thăm blog của các bạn nhiều hơn .
Code này của bạn Hồng Hải Blog tạo ra và ở đây mình đã chỉnh sửa đi một tý rồi nhé :D


Bước 1:  Chèn code này dưới thẻ ]]></b:skin>
.post blockquote{margin:10px 0;text-align:left!important;padding:50px 10px 10px 15px;transition:.3s;font:400 17px Monospace;color:#888;max-height:400px;overflow:hidden;line-height:1.5;position:relative;background:#f4f4f4;border:2px solid #ddd;overflow:auto}
.post blockquote:before{content:'\f121  CODE';font-family:"Font Awesome 5 Free",Roboto Condensed;font-weight:700;position:absolute;font-size:1em;left:0;top:0;margin:0;display:block;width:100%;background:#ddd;padding:10px;box-sizing:border-box;    -webkit-transition: .3s;}
.post blockquote::-webkit-scrollbar{width:8px}
.post blockquote::-webkit-scrollbar-thumb{background:#ddd}
.post blockquote:-webkit-scrollbar-thumb:window-inactive{background:#ddd}
.post blockquote::-moz-scrollbar{width:8px}
.post blockquote::-moz-scrollbar-track{background:#eee}
.post blockquote::-moz-scrollbar-thumb{background:#ddd}
.post blockquote::-o-scrollbar{width:8px}
.post blockquote::-o-scrollbar-track{background:#eee}
.post blockquote::-o-scrollbar-thumb{background:#ddd}
.post blockquote:after{content:'Cick Double Để Copy Code';padding:2px 5px;width:auto;height:auto;font-family:"Font Awesome 5 Free",Roboto Condensed;position:absolute;right:8px;top:8px;color:#595b8a;font-weight:700;background-color:none;transition:all 0.3s ease-in-out;font-size:1em}
.post blockquote:hover::after{opacity:0;top:-8px;visibility:visible}
code{display: inline-block; position: relative; color: #6aafa3; margin: 0 5px; padding: 0 10px; transition: all .3s; border: 1px solid; border-radius: 4px; font: 400 18px Monospace;}



Bước 2 :   Khi các bạn đăng bài chuyển qua HTML rồi dán code bên dưới :
<div style="text-align: center;">
<button class="button-box"><a class="green" href="https://ttcnstarquuocblog.blogspot.com/"><i aria-hidden="true" class="fa fa-facebook-square"></i> Demo</a></button>
<style>/*----BUTTON STARQUOCBLOG----*/
.button-box a{color: #fff!important}
.button-box {
margin: 10px;
background: #26A65B;
width: 14%;
padding: 7px;
border-radius: 20px;
font: 700 17px Roboto Condensed;
outline: 0;
border: none;
box-shadow: 2px 2px 10px rgba(119, 119, 119, 0.5);
transition: all .5s ease-in-out;
}
.button-box:hover {
background: #1E824C;
transform: scale(1.05);
transition: all .3s ease-in-out;
}
@media screen and (max-width: 414px){.button-box {width: 27%!important}}
</style>

<button class="button-box"><a class="green" href="http://vnurl.net/2Q3es"><i class="fa fa-download"></i> Download</a></button>
<style>/*----BUTTON STARQUOCBLOG----*/
.button-box a{color: #fff!important}
.button-box {
margin: 10px;
background: #26A65B;
width: 14%;
padding: 7px;
border-radius: 20px;
font: 700 17px Roboto Condensed;
outline: 0;
border: none;
box-shadow: 2px 2px 10px rgba(119, 119, 119, 0.5);
transition: all .5s ease-in-out;
}
.button-box:hover {
background: #1E824C;
transform: scale(1.05);
transition: all .3s ease-in-out;
}
@media screen and (max-width: 414px){.button-box {width: 27%!important}}
</style>

</div>




Chúc các bạn thành công 
- - 27 bình luận
CHUYÊN MỤC
- Đối với tôi mọi thứ mình biết chưa nên tự cho mình là giỏi,hãy nên học hỏi nhiều hơn để thành công...
- Mọi chi tiết xin liên hệ:
Email: Naruto95qt@gmail.com
Zalo Me: Zalo.com/01625271155

BÌNH LUẬN (27)

  1. Ra bài buổi trưa không biết ai xem không ta :v

    Trả lờiXóa
  2. đoạn code gán trong bài dài vc -.-

    Trả lờiXóa
  3. Trả lời
    1. Ông cmt link tôi đặt cho

      Xóa
    2. TÊN HIỂN THỊ: LÊ ANH ĐỨC
      LINK: http://www.leanhduc.tk/

      Xóa
  4. Trả lời
    1. Ùhm ôg
      Cái chèn vào bài đăng ấy
      Dài bome, dùg cái này cho sướng :)

      Xóa
  5. qua tương tác chơi bác Quốc ơi

    Trả lờiXóa
  6. Bài viết rất hay
    CTV Thông Báo....
    Hiện tại Star Phong Blog đang bệnh rất nặng nên tạm thời hoãn blog
    Các bạn có thể hủy liên kết

    Trả lờiXóa
  7. Button đẹp lắm anh, nhìn quá chuyên nghiệp, cứng!

    Trả lờiXóa
  8. Thấy blog e nhiều bài thủ thuật FB với PSD cmnd mà a thì ko rành mấy cái đó mấy nên ghé xem bài này!

    Trả lờiXóa
    Trả lời
    1. Vâng em cám ơn anh đã ghé thăm Blog của em

      Xóa

Một số lưu ý khi bình luận

Vui lòng xem Hướng Dẩn Sử dụng trước khi bình luận

Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời

Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước (xem nội quy)