Customizing Your Facebook Fan/Like Box With CSS

Today I am going to show you how to customize your Facebook Fan/Like Box with CSS. You can able to customize its hight and width as you want. If you like this then surely add it on your blog but don't remove the footer links which give credits to my work.Here I am giving list of older custom like boxes...


How To Add Custom FB Like Box To Blogger


  • Go to Blogger Dashboard > Design > Page Layout.
  • Choose Add A Gadget > HTML/JavaScript.
  • Paste below code and save it. 
<style>
.fbInner{
background:#F6CECE;
width:300px;
border:1px solid #FA5858;
padding:2px;
}
</style>
<div class="fbInner">
<div class="textwidget"><script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script>
<script type="text/javascript">FB.init("1690883eb733618b294e98cb1dfba95a");</script>
<fb:fan profile_id="153138708123803" stream="0" connections="10" logobar="0" width="300" height="274" css="http://widgetsforblog.googlecode.com/files/btsnts-custom-fbv4.css?1" class=" FB_fan FB_ElementReady"></fb:fan><div dir="ltr" style="text-align: left;" trbidi="on"><div style="text-align: right;">
<span style="font-family: Verdana, sans-serif; font-size: xx-small;"><a href="http://www.helpblogger.in/2013/11/customizing-your-facebook-fanlike-box.html" target="_blank">Custom FB Like Box</a></span></div>
</div></div></div>


  • Now change with your facebook page username ID if you don't know your ID then you can use our ID Finder Tool.
  • To change height and width then find these lines and change it ass you wish width="300"   and  height="274"
Now save it and you are done...

You may like these posts