Việc tích hợp Livebox Facebook vào blogspot hiện nay rất được nhiều blogger quan tâm. Có rất nhiều cách để thực hiện việc này.
Hôm nay tôi xin giới thiệu một cách tích hợp Livebox vào blog của bạn. Nó là một thanh trược được mã hóa ẩn Likebox bên trong và chỉ thấy nó chỉ khi người thăm blog của bạn tác động vào nó.
Về Blogger> Bố cục
Bấm vào nút "Thêm Tiện ích"
Chọn HTML / JavaScript Widget
Dán đoạn mã sau bên trong nó
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG0IWCd015DpIjUB3162-cfdAJ8N9Risl_4fLJhyphenhyphenZK48SQKZYiRpexIWfcfBPOUo_G7I3FmhfbOcisSDb5K9ddGC-q41hR6R1OavpyDkxc4wmIZJdeWiKa5J_MAQXsbADI4L_t-po9LrtL/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Infographic/367055943424486?ref=hl&width=245&colorscheme=light&show_faces=true& connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>Widget by:<a href="http://http://infographics-vn.blogspot.com/">Infographics trên Facebook</a></span></div></div>
Thay phần chữ đỏ phía trên bằng URL Fanpage của bạn.
Sau đó vào >Mẫu> Chỉnh sữa HTML
Tìm kiếm đoạn <head> và dán đoạn Jquery sau ở phía dưới nó
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
Luu lại và xem lại blog của bạn đã xuất hiện Likebox như ý muốn chưa.
Chúc các bạn thành công.
Hôm nay tôi xin giới thiệu một cách tích hợp Livebox vào blog của bạn. Nó là một thanh trược được mã hóa ẩn Likebox bên trong và chỉ thấy nó chỉ khi người thăm blog của bạn tác động vào nó.
Xem Live Demo: InfographicSau đây là hướng dẫn.
Về Blogger> Bố cục
Bấm vào nút "Thêm Tiện ích"
Chọn HTML / JavaScript Widget
Dán đoạn mã sau bên trong nó
<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG0IWCd015DpIjUB3162-cfdAJ8N9Risl_4fLJhyphenhyphenZK48SQKZYiRpexIWfcfBPOUo_G7I3FmhfbOcisSDb5K9ddGC-q41hR6R1OavpyDkxc4wmIZJdeWiKa5J_MAQXsbADI4L_t-po9LrtL/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Infographic/367055943424486?ref=hl&width=245&colorscheme=light&show_faces=true& connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>Widget by:<a href="http://http://infographics-vn.blogspot.com/">Infographics trên Facebook</a></span></div></div>
Thay phần chữ đỏ phía trên bằng URL Fanpage của bạn.
Sau đó vào >Mẫu> Chỉnh sữa HTML
Tìm kiếm đoạn <head> và dán đoạn Jquery sau ở phía dưới nó
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
Luu lại và xem lại blog của bạn đã xuất hiện Likebox như ý muốn chưa.
Chúc các bạn thành công.
Ghi rõ nguồn www.seoer.com.vn khi đăng lại thông tin này
Đăng nhận xét