-->

Widget author box đơn giản cho blogger

Cách cài đặt tiện ích hộp tác giả đơn giản trên Blogger:

1. Truy cập Blogger.com
2. Nhấp vào Bố cục > Thêm tiện ích > chọn HTML / JavaScript
3. Sau đó, nhập mã sau:

<style type="text/css">
/* author box */
.cm-author{font-family:'Open Sans',Arial,sans-serif;position:relative;display:inline-block;min-width:230px;max-width:336px;width:100%;text-align:left;font-size:16px;background:#f5f5f5;border-radius:5px;margin-top:15px}
.cm-author *,.cm-author:before,.cm-author:after{-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all 0.4s ease;transition:all 0.4s ease}
.cm-author img{max-width:35%;margin-top:-15px;margin-left:60%;margin-bottom:15px;backface-visibility:hidden;vertical-align:top;border-radius:5px}
.myprofile{position:absolute;top:0;right:40%;left:0;bottom:0;padding:15px}
.cm-author h3{margin:0;font-size:1.1em;font-weight:bold}
.cm-author h3 a{color:#656565;text-decoration:none}
.cm-author h3 a:visited{color:#656565;text-decoration:none}
.cm-author .icons{font-size:1.6rem}
.fa-facebook{color:#bababa}
.fa-facebook:hover{color:#3b5998}
.fa-twitter{color:#bababa}
.fa-twitter:hover{color:#55acee}
.fa-instagram{color:#bababa}
.fa-instagram:hover{color:#e95950}
.fa-youtube-play{color:#bababa}
.fa-youtube-play:hover{color:#ff0000}
.mysite{font-size:12px;font-style:italic}
</style>
<div class="cm-author">
<img src="https://lh3.googleusercontent.com/-RaSCRAxM6FE/WuSyZDD78_I/AAAAAAAABH8/kECPHFYqOgQoHVhiVtjGJBF5B2xR5L6ugCEwYBhgL/w140-h140-p/31337787_594144790939324_8136689480686895104_n.jpg" alt="Lê Bá Long IT" title="Lê Bá Long IT"/>
<div class="myprofile">
  <h3><a href="https://plus.google.com/111355068045491281734" title="Lê Bá Long IT">Lê Bá Long IT</a></h3>
  <div class="icons">
    <a href="https://www.facebook.com/Quangthin.57" title="Facebook"><i class="fa fa-facebook"></i></a>
    <a href="https://twitter.com/DZOYLYRICS" title="Twitter"><i class="fa fa-twitter"></i></a>
    <a href="https://www.instagram.com/dragonlegends_" title="Instagram"><i class="fa fa-instagram"></i></a>
    <a href="https://www.youtube.com/DZOYLYRICS" title="Youtube"><i class="fa fa-youtube-play"></i></a>
  </div>
  <div class="mysite">https://lebalongit.blogspot.com</div>
</div></div>
4. Nhấp vào Lưu và xem kết quả
Lưu ý:
Nhớ thay thế URL truyền thông xã hội và ảnh tiểu sử của bạn. 

Nếu biểu tượng phương tiện truyền thông xã hội không xuất hiện, hãy thêm mã này phía trên mã </body>trong trình chỉnh sửa mẫu blog của bạn.
<link href='//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/> 

Đó là một bài viết về cách tạo một hộp tác giả tiện ích đơn giản trong blog bên , chúc may mắn và hy vọng hữu ích. 

Nếu bạn gặp bất kỳ vấn đề nào khi cài đặt tiện ích này, vui lòng liên hệ với chúng tôi qua trang liên hệ, càng nhiều càng tốt, chúng tôi sẽ giúp bạn sử dụng tiện ích con này.
> Chúc Thành Công - caramanual 

Viết bình luận (6)
Xếp theo