How to add slide facebook likebox to blogger?

Open your Blogger Dashboard > Layout > Add a Gadget Step > HTML/JavaScript. Copy the code below, change the red color with your facebook url and paste on HTML/JavaScript and Save it.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {$(".wcfbslide").hover(function() {$(this).stop().animate({right: "-5"}, "slow");}, function() {$(this).stop().animate({right: "-300"}, "medium");}, 500);});
</script>
<style type="text/css">
.wcfbslide{background: url("http://1.bp.blogspot.com/-73Kl0WAVtTU/UbV3J4wvgeI/AAAAAAAACAs/Pb-tonF1TjY/s1600/windroidclubfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 250px;padding:0 5px 0 46px;width: 295px;z-index: 99999;position:fixed;right:-300px;top:22%;}
.wcfbslide div{border:none;position:relative;display:block;}
.wc-gplusfollow
{
 position: relative;
 padding: 10px;
 background:#ffffff;
 border: 1px solid #ccc;
 box-shadow: inset 0 0 30px rgba(0,0,0,0.1), 1px 1px 3px rgba(0,0,0,0.2);
}
</style><div class="wcfbslide">
<div class="wc-gplusfollow"><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Bae-Taang/110308479072201&width=295&height=250&show_faces=true&colorscheme=light&stream=false&show_border=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:295px; height:250px;" allowtransparency="true"></iframe>
</div></div>