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
About Mathias Amodu 893 Articles
My Name is Mathias Amodu, a passionate blogger with full interest in making the world a better place for upcoming webmasters in the society at large

4 Comments

  1. Abdulmalik Amodu May 30, 2016
  2. michaelll013@gmail.com August 9, 2017
  3. AlamNobi September 16, 2017
  4. Vanwingerden Urick April 10, 2018

Leave a Reply

*