Tiện ích đăng ký theo dõi đẹp cho Blogspot

• Thêm dữ liệu có cấu trúc breadcrumb trong bài viết blogspot Read More
• Tạo các nút next, prev hiển thị ảnh bài viết của trang kế và trang trước Read More
• Cách tạo và đọc tệp robots.txt trong blogspot Read More
• Tiện ích đăng ký theo dõi đẹp cho Blogspot Read More
• Cách thêm m=1 vào liên kết trong bài viết khi xem trên thiết bị di động Read More
• Hướng dẫn để Google lập chỉ mục và tạo site links cho trang label Read More
• Share Template Blogspot Twitter V4.5 Read More
• Cách sử dụng các thẻ điều kiện Blogger Read More

Chào các bạn, để cho người đọc tiện theo dõi các bài viết mới của bạn thì khung theo dõi có tích hợp mạng xã hội là một lựa chọn rất tốt. Vì thể trong bài viết này mình xin hướng dẫn các bạn tạo “Tiện ích theo dõi bài viết đẹp cho Blogspot”. Hy vọng nó mang lại nhiều hữu ích cho website của bạn!

HTML<div class="bsd-container">

<div class="sidebar_about_author">

<div class="inner_wrapper">

<div class="bsdbox-img">

<img alt="CBMONKEY" class="img-responsive" height="auto" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMXfrVCt5HJaiYpMFxe_b8jX4wsqkMiIN741GqKdssYWsTUf92jZDFo1oZJQRCr3AX2KVlxUzfCypwU5ykEpa-6H1lEaREzQ81WsgB7DtJSixchqhVLNwJJjBY4xLVt_LGXLZy6cn5ayD2/w140-h114-p/sdf.jpg" title="CB MONKEY" width="300" />

<br />

<div class="joinfloat-img">

<span class="bsdbox-float"><a href="https://www.blogger.com/follow-blog.g?blogID=8797757829609526032" rel="nofollow" target="_blank" title="Đăng Ký Ngay +"><i class="fa fa-laptop"></i> Đăng Ký Ngay</a></span></div>

</div>

</div>

<div class="bsdbox-info">

<h4>

CB MONKEY</h4>

Thủ Thuật - Template Fee</div>

<div class="bsdbox-wrap">

<ul class="bsdextend">

<li class="bsdbox-icon facebook">

<a href="https://www.facebook.com/chubang9x" target="_blank" title="Follow us on Facebook"><i class="fa fa-facebook fa-fw"></i>Theo Dõi</a>

</li>

<li class="bsdbox-icon twitter">

<a href="https://twitter.com/monkey_cb" target="_blank" title="Follow us on Twitter"><i class="fa fa-twitter fa-fw"></i>Theo Dõi</a>

</li>

<li class="bsdbox-icon circle">

<a href="https://www.instagram.com/cbmonkey9x/" rel="nofollow" target="_blank" title="Follow us on instagram"><i class="fab fa-instagram"></i>Theo Dõi</a>

</li>

</ul>

</div>

</div>

</div>

<style>.bsd-container{position:relative;display:block;background:#fff;padding:10px;border:1px solid #eee;overflow:hidden}.bsdbox-info h4{background:transparent;position:relative;padding:0;margin:0;border:0;text-align:center;font-size:110%}.bsdbox-img{position:relative;max-height:135px;overflow:hidden}.bsdbox-img img{max-width:100%;width:100%;transition:all .6s}.bsdbox-img:hover img{transform:scale(1.2) rotate(-9deg)}.bsdbox-img:before{content:'';background:rgba(0,0,0,0.2);position:absolute;top:0;left:0;right:0;bottom:0;z-index:2;transition:all .3s}.bsdbox-img:hover:before{background:rgba(0,0,0,0.5)}.joinfloat-img{width:56%;position:absolute;top:36%;bottom:36%;left:22.6%;z-index:4}.bsdbox-float{text-align:center;display:table;width:100%;height:100%}.bsdbox-float a{background:transparent;color:#00bcd4;padding:8px 14px;z-index:2;display:table-cell;width:100%;font-size:90%;text-transform:uppercase;vertical-align:middle;border:1px solid #00bcd4;border-radius:4px;transition:all .3s}.bsdbox-float:hover a{background:#00bcd4;color:#fefefe;border-color:transparent}.bsdbox-float a i{font-weight:normal;margin:0 6px 0 0}.bsdbox-wrap{display:block;margin:14px auto;position:relative}.bsdbox-wrap .bsdextend{width:100%;display:block}.bsdextend{text-align:center;font-size:17px}.bsdextend .bsdbox-icon{display:inline-block;border:0;margin:0;padding:0;width:32%}.bsdextend .bsdbox-icon a{background:#768187;display:inline-block;font-weight:410;color:#fefefe;padding:0 12px;line-height:32px;border-radius:4px;font-size:11px;width:100%}.bsdextend .bsdbox-icon i{font-family:fontawesome;margin:0 4px 0 0}.bsdbox-icon.facebook a{background:#3b5998}.bsdbox-icon.twitter a{background:#19bfe5}.bsdbox-icon.circle a{background:#d64136}.bsdbox-icon.facebook a:hover,.bsdbox-icon.twitter a:hover,.bsdbox-icon.circle a:hover{background:#415471}.extender .bsdbox-icon:hover a,.extender .bsdbox-icon a:hover{color:#fefefe}.bsdbox-info{margin:11px 0 0 0;font-size:12px;text-align:center}.bsdbox-info p{margin:6px 0}.bsdbox-info h4{position:relative;margin-bottom:11px;font-size:15px;text-transform:uppercase;color:#00bcd4;font-weight:600}.bsdbox-info h4 span{position:relative;display:inline-block;padding:0 11px;margin:0 auto}.bsdbox-info h4:before,.bsdbox-info h4:after{position:absolute;top:52%;overflow:hidden;width:50%;height:1px;content:'a0';background-color:rgba(0,0,0,0.07)}.bsdbox-info h4:before{margin-left:-50%;text-align:right}</style>

Thêm tiện ích vào blogspot:

Truy cập vào Blogger -> thêm tiện ích -> HTML/JavaScript - > paste đoạn code sau -> Lưu (Bạn hãy chèn nó vào vị trí thích hợp nhé, thông thường là ở phía sidebar)

Lưu Ý : thay dòng 8797757829609526032  thành ID Blogger của bạn!
thay các dòng màu xanh thành link tương ứng!

Created by CB MONKEY