Top Ad unit 728 × 90

.

Mới nhất

Seo-blogspot

Social subscribe color full cho blogspot

Ngày nay mạng xã hội tương tác khá nhiều với bất cứ một website nào và nếu không bắt kịp với xu hướng này thì website/blog của bạn chắc chắn sẻ thua trên mặt PR trên đấy, chính vì như vậy post này sẻ share cho doanh nghiệp một đoạn code kết hợp giữa css và html để triển khai Socials to fanpage facebook trên những mạng xã hội phổ biến.

Thêm Social theo dõi mạng xã hội

Như nói trên thì tôi chỉ sử dụng css và html nên việc thêm vào trong blog hay website sẻ không có tác động gì tới vận tốc load cả mà nó còn mang tới cho website của bạn thêm màu sắc, thêm ấn tượng.

Xem thêm: Thêm post thường thì đẹp cho blogger/blogspot

Social subscribe color full cho blogspot
Button share đẹp cho blogspot

Demo trực tiếp tại đây

Thực hiện:

1. Vào Blogger Dashboard > Template > Edit HTML.
2. Tìm ]]></b:skin> (Nhấn Ctrl + F để tìm) và dán mã CSS Sau đây trước thẻ đó.
a{text-decoration: none;}.tips24h-social div{padding-bottom: 10px;}
.tips24h-social{
overflow: hidden;
margin-bottom: 20px;
}
.tips24h-social a{
display: block;
padding-left: 20px;
color: #FFFFFF !important;
font-weight: 600;
font-family: "Open Sans","Tahoma","Verdana","Arial", sans-serif;
border-radius: 15px 15px 15px 15px;
transition: border-radius 0.50s;
-webkit-transition: border-radius 0.50s;
-moz-transition: border-radius 0.50s;
}
.tips24h-social a:hover{
border-radius: 0px 0px 0px 0px;
}
.tips24h-social div{
float: left;
margin-right: 10px;
width: 138px;
}
.tips24h-social .tips24hfacebook a{
padding: 7px 10px 7px 26px;
background: #3B5999 url('http://3.bp.blogspot.com/-yqD2363XuAo/UeDk98twSlI/AAAAAAAAArg/kXIzFBWmczM/s1600/fb14.png') no-repeat 10px center;}
.tips24h-social .tips24hfacebook a:hover{
background: #555 url('http://3.bp.blogspot.com/-yqD2363XuAo/UeDk98twSlI/AAAAAAAAArg/kXIzFBWmczM/s1600/fb14.png') no-repeat 10px center;
}
.tips24h-social .tips24htwitter a{
padding: 7px 10px 7px 32px;
background: #01BBF6 url('http://3.bp.blogspot.com/-0u8P4VQmEeU/UeDlVdilwcI/AAAAAAAAAro/lGTnlvHGyVw/s1600/twitter14.png') no-repeat 8px center;
}
.tips24h-social .tips24htwitter a:hover{
background: #555
url('http://3.bp.blogspot.com/-0u8P4VQmEeU/UeDlVdilwcI/AAAAAAAAAro/lGTnlvHGyVw/s1600/twitter14.png') no-repeat 8px center;
}
.tips24h-social .tips24hgoogleplus a{
padding: 7px 10px 7px 32px;
background: #D54135 url('http://3.bp.blogspot.com/-A8fFRexz_zk/UeDlgadvpiI/AAAAAAAAArw/TRd7NWNwo9s/s1600/gplus14.png') no-repeat 10px center;
}
.tips24h-social .tips24hgoogleplus a:hover{
background: #555
url('http://3.bp.blogspot.com/-A8fFRexz_zk/UeDlgadvpiI/AAAAAAAAArw/TRd7NWNwo9s/s1600/gplus14.png') no-repeat 10px center;
}
.tips24h-social .tips24hlinkedin a{
padding: 7px 10px 7px 35px;
background: #167FB1 url('http://4.bp.blogspot.com/-yuEMxhpIXPc/UeDltjBGR1I/AAAAAAAAAr4/kgidavlGbY8/s1600/linkedin14.png') no-repeat 10px center;}
.tips24h-social .tips24hlinkedin a:hover{
background: #555 url('http://4.bp.blogspot.com/-yuEMxhpIXPc/UeDltjBGR1I/AAAAAAAAAr4/kgidavlGbY8/s1600/linkedin14.png') no-repeat 10px center;
}
.tips24h-social .tips24hpinterest a{
padding: 7px 10px 7px 32px;
background: #CB2027 url('http://1.bp.blogspot.com/-v-ZkEQhYpug/UeDl6uIio-I/AAAAAAAAAsA/9rqq2cXT08k/s320/pinterest14.png') no-repeat 10px center;
}
.tips24h-social .tips24hpinterest a:hover{
background: #555 url('http://1.bp.blogspot.com/-v-ZkEQhYpug/UeDl6uIio-I/AAAAAAAAAsA/9rqq2cXT08k/s320/pinterest14.png') no-repeat 10px center;

}
.tips24h-social .tips24hdelicious a{
padding: 7px 10px 7px 32px;
background: #3173D1 url('http://2.bp.blogspot.com/-J9p31gkQfXw/UeDmILHMQwI/AAAAAAAAAsI/bEws_iRNx7g/s320/delicious14.png') no-repeat 10px center;
}
.tips24h-social .tips24hdelicious a:hover{
background: #555 url('http://2.bp.blogspot.com/-J9p31gkQfXw/UeDmILHMQwI/AAAAAAAAAsI/bEws_iRNx7g/s320/delicious14.png') no-repeat 10px center;
}
.tips24h-social .tips24hdelicious{
margin-right: 0;
}
Sau khi thêm vào ngừng bạn ấn lưu mẫu.

Tiếp theo bạn quay ra "Blogger Dashboard" để thêm vào 1 tiện ích HTML. Tùy bạn muốn chúng hiển thị ở đâu.

<div class="tips24h-social">
<div class="tips24hfacebook">
<a href="https://www.facebook.com/seocucre.com" target="_blank">Facebook</a></div>
<div class="tips24htwitter">
<a href="https://twitter.com/tips24hdotnet" target="_blank">Twitter</a></div>
<div class="tips24hgoogleplus">
<a href="https://plus.google.com/" target="_blank">Google+</a></div>
<div class="tips24hlinkedin">
<a href="http://in.linkedin.com/in/" target="_blank">Linkedin</a></div>
<div class="tips24hpinterest">
<a href="http://pinterest.com/" target="_blank">Pinterest</a></div>
<div class="tips24hdelicious">
<a href="#Delicious_Profile" target="_blank">Delicious</a></div>
</div>
Với những url tôi tô đỏ bạn hãy thay nó thành profile của site bạn tương ứng trên những mạng xã hội.




Hãy để lại comment phía dưới, quản lý viên của Seocucre.com sẽ hỗ trợ bạn
chúc mọi người thành công!!
Social subscribe color full cho blogspot Reviewed by Thietkeblogspot on 4:39 PM Rating: 5

No comments:

All Rights Reserved by Seo cực rẻ © 2014 - 2015

Liên hệ để SEO ngay

Name

Email *

Message *

Powered by Blogger.