Saturday 3 November 2012

How to add Floating Facebook Like Box to Blogspot Blogs

by Rohit Malik
blogspottutz.blogspot.com
Social Media sites have become a bit popular these days.So it has become important to use social media site to promote your blog or website.It has become and integral part for the blogging niche and blog building material.As they provide a bit of high majority backlinks to your website and helps up to increase traffic by just placing your link on the social media site.Facebook the most popular widely used social media these days.The trending of products and advertisements on facebook is on fire these days.So,i considered sharing a widget for you which will help you
increase your fan page viewers and also your blog readers too.
1.Go to Blogger Dashboard-->Layout-->Add a Gadget.
2.Choose Html/Java Script.
3.Paste the below code inside it.

<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/-UuBsjDC5vSc/TuiSd0g9bHI/AAAAAAAAAyk/MqKt8IpiIVM/s1600/facebook1.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: 10px;font: 9px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #FF9D00;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://www.facebook.com/BlogspotTutorials&amp;
width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=8&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span>Widget by:<a href="http://www.blogspottutz.blogspot.com">Best Blogger Tutorials</a></span></div></div>
4.Replace BlogspotTutorials with your Fan Page User Name
5.Finally save your Gadget and preview your blog.

Get free daily email updates!

Follow us!
Like Us.... Receive updates on your Facebook wall!!!!

3 comments:

  1. Unknown26 February 2015 at 02:09

    Thanks for sharing this post. Keep further posting...!! Internet Marketing Services

    web design company & SEO promotion 


    ReplyDelete
  2. 1800GiftPortal3 December 2019 at 04:05

    Thanks, this code is working great for me. Appreciating your sharing and effort.
    Christmas Gift Ideas Australia

    Christmas Hampers Australia

    Flowers To Australia

    ReplyDelete
  3. Cityweb Pune10 January 2020 at 04:35

    I have recently add this code for valentines day and it is working great for me. Thanks for your inputs.
    View here for more information. | web development company in pune
     | web development pune

    ReplyDelete