Add floating like box to your blogger

 Recently we shared simple yet stylish floating facebook like box widget for blogger.This will Floating Facebook Button when to move your cursor on it it pop out with stylish floating facebook like box. This will help you to increase facebook likes. You just need to put small code to your blogger blog.  Currently this widget is only for Bloggeer/Blogspot blogs. We will soon share about WordPress in our next post. Now lets move to how you can add this in blogger I will show you How You Can Add Another New Floating Facebook Like Box Widget For Blogger?

Add floating like box to your blogger

1. Go to Design > Page Elements.
2. Click Add A Gadget.
3. In Add A Gadget window, select the HTML/Javascript .
4. Paste the following code inside it,

<script type="text/javascript">
 /*<![CDATA[*/
 jQuery(document).ready(function() {jQuery(".abtlikebox").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);});
 /*]]>*/
 </script>
 <style type="text/css">
 .abtlikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjh0Pxm0AJXLP9tR5TVWUZd7f35xD_xfw0ZkmOiI2l2MognPmMItK8VAZFDi2AXYmwVpYeJSNC954q3ODzM_IW8wh-9rFp_ypAzNAJRk4uuVs3LZAEPwR5Vte4LWycNvk_C06C-1ths_Iw/s320/fb1-right.png") no-repeat scroll left center transparent !important; float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index:  99999;position:fixed;right:-250px;top:20%;}
.abtlikebox div{ padding: 0; margin-right:-8px; border:4px solid  #3b5998; background:#fafafa;}
.abtlikebox span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
 .abtlikebox span a{color: gray;text-decoration:none;}
 .abtlikebox span a:hover{text-decoration:underline;}
}
</style>
 <div class="abtlikebox" style="">
     <div>
     <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fkohalpurtech&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;border_color=white&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 245px;background:#fafafa;"></iframe><span>Widget by :<a href="http://www.kohalpurtech.blogspot.com"> Kohalpurtech</a></span>
     </div>
 </div>

5. Click on Save button and done !

Note:-

Replace kohalpurtech With Your Facebook Page URL or User name.