Add Facebook Popup Like Box in Blogger Template

I found lots of tutorial over internet about How to add Popup Like Box in blogger Template, After searching a lot , a found this one best, and check all code in my Try out Hairstyles Blog. Everything is fine, there has no error, Now I am going to tell you everything here, So you can also add Facebook Poppup like box in your Blogger template.

Here is step by step process to go,

1. Open you Blogger dashboard and go you template section to edit HTML code.
2. Look for </head> and place following code before </head> .
3. Code to place-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>
4. Save Template.

6. Now go to layout section, click "add a gadget"  to add  html/java script code.
7. Add following code here,

<a href="http://tryouthairstyles.blogspot.com/" target="_blank" title="Blogger Widgets"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><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/AVvXsEg0XVFBWapHuI8ZHPgs9ffNPiOKccaUsUmYJL42OkKo_XBxI5goKGLLCiw2BUcp07xpLnqjk0JuI4RlC1bPFWe33yijEFqiBNRCd9axCsDojEQ4wN0XZFvF1WeJAiM_mHbmcJOiAEjTI5uz/s1600/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=https://www.facebook.com/updohairstyles&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><span>By <a href="http://facebook.com/mfshahi">shahi</a> / <a href="http://www.techtunes.com.bd/?p=149612">+Get This!</a></span></div></div>
</div>

8. Replace  https://www.facebook.com/updohairstyles with your facebook page  url and replace http://tryouthairstyles.blogspot.com/ with you blog url.

9.Save  everything.
10. Enjoy.