Facebook line box for blogger

As per My view, this Facebook like box best suits under each blog posts so I'm going to give you the simple tutorial on placing this advanced Facebook Like box below your blogger blog posts.

1. Go to blogger dashboard --> Template --> Edit Html (Tick Expand widget template option).

2. Find for ]]></b:skin> tag and place the following peace of code just above it.

#BTbiz-fb {
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-goog-ms-border-radius: 10px 10px 10px 10px;
border-radius: 10px;
box-shadow: 5px 5px 5px #CCCCCC;
background: none repeat scroll 0 0 transparent;
border: 1px solid #D3D3D3;
padding:10px;
margin-top:25px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width:560px;
}
# BTbiz-fb:hover{
background: none repeat scroll 0 0 #FFF;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
}
# BTbiz-fb  td{
padding:3px 0;
}

3. Now find for <data:post.body/> and place the following peace of code below it.

Advanced Facebook Like box widget code

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='BTbiz-fb'>
<div id='BTbiz'>
<table width='100%'>
<tbody> <tr><td>
<span style='font-style: normal; font-size: 23px; font-family:Georgia,Times New Roman,Trebuchet MS; '>Like Us....   Receive updates on your Facebook wall!!!!</span></td></tr>
<tr><td>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fbloggertricksdotbiz&amp;
width=590&amp;height=180&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23fff&amp;stream=false&amp;header=false' style='border:none !important; overflow:hidden; width:560px; height:180px;'/></td></tr>
</tbody> </table></div></div>
</b:if>

4. Save the template.