Thứ Ba, 26 tháng 3, 2013

Code Widget mạng xã hội đẹp cho blogspot

Đây có lẽ là những gì tất cả các blogger đã được chờ đợi là một slide tuyệt vời xã hội chia sẻ ra widget mà làm việc với blogger blog, wordpress blog và các trang web.


Cách Thực Hiện :
Bước 1: Vào blogger > Bố cục > Thêm widget HTML/Javascript mới vào vị trí bạn muốn hiển thị tiện ích Thống Kê
Bước 2: Dán code bên dưới vào form nội dung :

<style type='text/css'>
.follow-icon {background:none repeat scroll 0 0 FaFaFa;border-bottom:1px solid #F0F0F0;margin:-9px -15px 0;padding:15px 13px 5px 13px;float: left;text-align: center;font-size: 11px;}
.follow-icon .icon {background-image: url(http://2.bp.blogspot.com/-nbr5shMq1CA/UT3nkLBbQ0I/AAAAAAAADRA/xop9D4jvKZg/s1600/follow+icons02.png);width: 45px;height: 46px;display: block;margin: 0 5px 0 5px;}
.follow-feed .icon{background-position:0 0}
.follow-feed .icon:hover{background-position:0 46px}
.follow-twitter .icon{background-position:-45px 0}
.follow-twitter .icon:hover{background-position:-45px 46px}
.follow-facebook .icon{background-position:-91px 0}
.follow-facebook .icon:hover{background-position:-91px 46px}
.follow-youtube .icon{background-position:-137px 0}
.follow-youtube .icon:hover{background-position:-137px 46px}
.follow-googleplus .icon{background-position:-182px 0}
.follow-googleplus .icon:hover{background-position:-182px 46px}
</style>
<a class='follow-icon follow-feed' href='http://feeds.feedburner.com' target='_blank'><span class='icon'></span><span class='label'>RSS Feed</span></a>
<a class='follow-icon follow-twitter' href='https://twitter.com' target='_blank'><span class='icon'></span><span class='label'>Twitter</span></a>
<a class='follow-icon follow-facebook' href='http://www.facebook.com' target='_blank'><span class='icon'></span><span class='label'>Facebook</span></a>
<a class='follow-icon follow-youtube' href='https://www.youtube.com' target='_blank'><span class='icon'></span><span class='label'>Youtube</span></a>
<a class='follow-icon follow-googleplus' href='https://plus.google.com' target='_blank'><span class='icon'></span><span class='label'>Google+</span></a>
Bước 3- Lưu mẫu lại.Lưu ý : Bạn thay đổi những code màu đỏ cho phù hợp web,blogs của bạn nhé.

Không có nhận xét nào:

Đăng nhận xét