Awesome Facebook Like Box!

This awesome facebook like box will enable your readers to share each of your posts and become a fan of your fanpage on facebook. This is an excellent way to increase facebook likes to your blog. Post high value content, add this like box to your blog, and watch likes grow.

How to add Facebook Like Box to your blog?

1. Backup your blog.

2. Login to Dashboard > Design > Edit HTML > Expand Widgets

3. Find the closing b:skin tag, that looks like this: ]]></b:skin>

4. Just above the closing tag paste the following css:

.fb_like_box {

margin-top:10px;

-moz-border-radius:10px 10px 10px 10px;

border-radius:10px;

background-color:#3B5999;

border:3px solid #2B2B2B;

margin-bottom:10px;

padding:10px 7px;

width:560px;

}

.fb_like_top {

overflow:visible;

padding:0;margin:0 0 5px;

width:349px;

height:24px;

background:url("http://3.bp.blogspot.com/-

g0Uu_u2oQx8/TlNMnZjF1UI/AAAAAAAABbY/TZAJwulTqdY/s1600/Facebook_logo.jpg") no-repeat

scroll left top transparent;

}

.fb_like_top a {

height:24px;

width:114px;

background:url("http://2.bp.blogspot.com/-75VArcE9Tzk/TlNMxuzswHI/AAAAAAAABbc/sSnUuD1jyF

8/s1600/Become+a+Fan.jpg") no-repeat scroll left top transparent;

display:block;

margin-left:445px;

text-indent:-5000px;

}.fb_like_button_holder {

-moz-border-radius:10px 10px 10px 10px;

border-radius:10px;

background:none repeat scroll 0 0 #FFFFFF;

padding:12px 12px 0 12px;

width:535px;

height:42px;

}

4. Now find <data:post.body/>

5. Just below it, add this code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div class='fb_like_box'>

<div class='fb_like_top'><a rel='nofollow' href='Facebook fanpage URL'>Become a Fan</a>

</div>

<div class='fb_like_button_holder'>

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?

href=&quot; + data:post.url +

&quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;f

ont=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none;

overflow:hidden; width:450px;height:30px;'/>

</div>

</div>

</b:if>

Replace the words Facebook fanpage URL with your facebook fan page address. Save the template, and it should look something like what you see below.