Posts Subscribe to This BlogComments

Follow Us


widget

make widget
Please Vote Us
Enter Yahoo Topsites | Yahoo Rare Sites | Yahoo Booter Sites and Vote for this site !!!
Vote For Us
Top Blogs BOOTER-CENTER - Find me on Bloggers.com
Mau Pasang Iklan Disini? Resize Banner 460X61
ads ads ads peluang usaha

Thursday, September 29, 2011

Tutorial to Add Stylish Facebook Like Box below Blogger Posts

Please Vote Us
Enter Yahoo Topsites | Yahoo Rare Sites | Yahoo Booter Sites and Vote for this site !!!
Vote For Us

This beautiful Facebook Like Box allow your Readers to Share the Post and also become a fan of your FanPage. This will increase facebook Likes to your blog. Have Good Content and this Widget below your post, then Watch likes flow.


Follow these 3 Steps to Add Facebook Like Box to all your Blogger Posts.

Backup Your Template First

Step 1: Login to Blogger > Design > Edit HTML > Expand Widgets

Step 2: Search for the following Code
.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/sSnUuD1jyF8/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;
}
Step 3: Now Search for
<data:post.body/>

Step 4: Below it , add the following 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;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px;height:30px;'/>
</div>
</div>
</b:if>
Replace Red Line with your Facebook fan page url.

Step 5: Save Template. That's it.

If you have any trouble making it work, drop in your comments.

Related Post



Get Traffic Like Spam
Loading...

0 Comment:

Post a Comment

Section meetings - Registered
recent entries

users online



ads ads ads ads
 

networkedblogs

B-C ON YAHOO

Trafic

Followers

MyFreeCopyright.com Registered & Protected MyFreeCopyright.com Registered & Protected