Thêm hộp social cực chất cho blogspot


Chào các bạn, cũng đã lâu rồi mình chưa viết bài gì cho blog nên hôm nay mình sẽ viết bài chia sẻ đến cho các bạn mẫu social cực chất cho blogspot
Phía bên dưới là Demo và Tutorial

HƯỚNG DẪN CÁCH LÀM:

Để thêm social các bạn đăng nhập vào blogger và thêm đoạn code bên dưới vào chỗ bạn muốn nó hiển thị (thường là dưới sidebar hoặc trên footer, tùy bạn)
<!-- Social bottom -->
<style>
.social-tom{float:right;height:44px}
.social-tom ul{margin:0}
.social-tom li{float:left;margin-left:10px;display:inline;padding:0}
.social-tom #social a{display:block;height:30px;width:30px;line-height:30px;font-size:14px;margin-top:7px;color:#fff;text-align:center;transition:.5s;border-radius:20px}
.social-tom #social a:before{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:400;line-height:27px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.social-tom .facebook:before{content:"\f09a"}
.social-tom #social a.facebook{background:#5d82d2}
.social-tom .twitter:before{content:"\f099"}
.social-tom #social a.twitter{background:#3bbef5}
.social-tom .google-plus:before{content:"\f1a0"}
.social-tom #social a.google-plus{background:#ea5d4b}
.social-tom .link:before{content:"\f0c1"}
.social-tom #social a.link{background:#686868}
.social-tom ul#social a{color:#fff;opacity:1;border-radius:100%}
</style>
<div class='social-tom'>
<ul id='social'>
<li><a class='facebook' href='https://www.facebook.com/TomSystemIT' target='_blank'/></li>
<li><a class='twitter' href='https://twitter.com/TThanhBinhTOM' target='_blank'/></li>
<li><a class='google-plus' href='https://plus.google.com/115364388908254010006' target='_blank'/></li>
<li><a class='link' href='https://www.facebook.com/messages/t/100010597577095' target='_blank'/></li>
</ul>
</div>
Chúc bạn thành công!

5
4
3
2
1

2 nhận xét:

  1. Klq mà màu temp mới hài hòa đấy, mọi thứ đều ở size normal, k quá to cũng k quá nhỏ, kết nhất phần tên tác giả trong viền dashed/

    Trả lờiXóa

» Hướng dẫn nhúng hình ảnh: [img]http://domain.com/image.png[/img]
» Tham trang khảo ảnh động cực cute: Qoobee
» Hướng dẫn nhúng link trang web: <a href="url" rel="nofollow" target="_blank">Link</a>
» Không chửi tục, nói bậy, quảng cáo thông qua khung Comment.
» Không spam link, chia sẻ các link không liên quan đến bài viết.
» Không xuyên tạc, bôi nhọ tổ chức hay cá nhân nào.
» Mọi bình luận sai nội quy sẽ bị xóa mà không cần báo trước.

Group giao lưu, giải đáp và chia sẻ kinh nghiệm blogspot - blogger :

  • Kích hoạt giao diện tối
  • Giao diện tối giúp bạn nhìn vào ban đêm, làm dịu mắt và tránh căng thẳng khi phải nhìn vào màn hình sáng quá nhiều.

    Đếm ngược thời gian đến tết Kỷ Hợi 2019