Sunday

Best Advanced Facebook Like box for Blogger blogs

The Facebook like box is one of the best gadget that keeps your audience moving in contact with you.
Over the years I discovered that Facebook has done it possible best to create different features for websites and blog for example the Facebook comment box for blogger blog and other platform.
Today I will teaching you how to use an advanced facebook like box for blogger blogs with out much stress.

Image





Step 1
First visit www.blogger.com



Step 2
Now on your blogger dashboard select your preferred blog which you will like to to add this feature to.




Step 3
Then scroll your move down to template tab and then click >>>> Edit HTML.



Step 4
Now on click any part in your HTML code then press CTRL+F and search for the below code.


]]></b:skin>



Step 5
place the following 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;
}




Step 6
Again search for the below code.


<data:post.body/>


Step 7
Then place the following peace of code below it.



<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 this page and get more info</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
%2F zealmat&amp;
width= 450&amp;height= 200 &amp;colorscheme
%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>


Step 8
Now finally save your template and then visit your blog to see how beautiful it is.






ARRANGEMENT

  • Replace Like this page and get more info with your own favorite description.

  • Replace zealmat with your Facebook username.
  • Replace 450 and 200 with your desired width and height.





Don't forget to drop your comment below thank you
Share :

zealmatblog

1 comment:

  1. Like seriously it has been my long time desire to link my page with my blog. I'll see to it

    ReplyDelete



Parse Your Adsense HTML code Here





We love to hear from you!

Sign in to comment "anonymously" without entering verification text.