New style to show facebook like page in blogger

New style to show facebook like page in blogger

How to add stylish facebook widget in your blog.  facebook widget contain like page , user can easily like facebook page and after liking this plugin get hide and show only facebook name. this facebook like box also helps to attract visitors to like facebook page. New style to show facebook like page in blogger…. .

If you dont know how to start blog than check our this blog 

facebook like page in blogger

Blogging skills do you know

How to show facebook like page in blogger with new style 

  • Open template —> Edit html
  • Look out for this  </head>
  • Add this code after 

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js” type=”text/javascript”></script>

  • Open Layout —-> Add html/JavaScript 
  • Paste this code 

<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(“http://1.bp.blogspot.com/–tscpVzcBjo/TdUarKtcAlI/AAAAAAAAA3I/qVkypiYO9rc/s150/w2b_facebookbadge.png”) 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=http%3A%2F%2Ffacebook.com%2facebook username&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270″ scrolling=”no” frameborder=”0″ scrolling=”no” style=”border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;”></iframe></div></div>

you will also like our this blogs about blogging
Memory boost tips

Leave a Reply

Your email address will not be published. Required fields are marked *