F

Thursday, 19 March 2015

HOW TO ADD FACEBOOK LIKE BOX ON YOUR BLOG OR WEBSITE

Hello Friends,
 Today Am Going TO tell You "HOW TO ADD FACEBOOK LIKE BOX ON YOUR BLOG OR WEBSITE".
Some People Already know it that how to add this but they didn't found the like box HTML CODE.So Today Here You Can find The Two Types of FACEBOOK LIKE BOX HTML Scripts.

1. SIMPLE FACEBOOK LIKE BOX. As shown in Figure Below :

                                                     
Simple Facebook Like Box | HOW TO ADD FACEBOOK LIKE BOX ON YOUR BLOG OR WEBSITE
Facebook Like Box

It is The most Famous and Use ful Like Box Which Look Pretty And Attractive It Also Show That People Who like Your Page And It Also Count The Like Of Your Page


As Shown in Figure And it's HTML Coding Is Here ....

HTML CODE OF SIMPLE FACEBOOK LIKE BOX :


<div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2F407113676108128&width=245&colorscheme=light&show_
faces=true&border_color=white&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 300px;background:#fafafa;color:000;"></iframe><span><center>

</center></span></div>






Just replae this code with your page Page address "407113676108128"


And Copy This Code, Goto Blogger.com And Open Your Blog's Layout And Add a New Gadget ,And hoose HTML CODE .Then Paste This There., And Drag gadget Where You want TO show Your FACCEBOOK LIKE BOX, And CLik On SAVE ARrANGMENTS


YOU CAN CUSTOMIZE YOUR SITE BY CLICK HERE

                CUSTOMISE BLOGGER BLOG


2. FLOATING FACEBOOK LIKE BOX AS SHOWN IN A FIGURE BELOW:...


Floating like Box |HOW TO ADD FACEBOOK LIKE BOX ON YOUR BLOG OR WEBSITE
Floating Like Box

This FB Floating Like Box Is Designed For Look Tricky Your Blog Or For If Your Blog Have Less Space To Show a Facebook Like Box on Page . It looks Beautiful When Your cursor Go on it It Automatic Float Outside .. Look Awesome.. 

   
>> .HTML CODE OF FLOATING LIKE BOX HERE :

<!--Floating Facebook Widget START-->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js'></script>
<script type="text/javascript"> /*<![CDATA[*/ jQuery(document).ready(function() {jQuery(".abt").hover(function() {jQuery(this).stop().animate({right: "0"}, "medium");}, function() {jQuery(this).stop().animate({right: "-250"}, "medium");}, 500);}); /*]]>*/ </script> <style type="text/css"> .abt{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmuHyj1VOXJuK7RklhfHISCiLXqJ-oaMiEhz5ftCDrjsK4pNJjP2YdRVv-CgTwe25EpUJ-9BPWaKg87V-HsKMC_4hCzoC5O2W_GSgiVn-T2GlKuSdJVHvG19-Am0bgkAwWpk1-2yVWg2JP/s1600/ABT_facebook_widget.png") no-repeat scroll left center transparent !important; float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;} .abt div{ padding: 0; margin-right:-8px; border:4px solid #3b5998; background:#fafafa;} .abt span{bottom: 4px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;} .abt span a{color: gray;text-decoration:none;} .abt span a:hover{text-decoration:underline;} } </style><div class="abt" style="">
<div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2FMYCOMPUTERSIR&width=245&colorscheme=light&show_
faces=true&border_color=white&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="border: white; overflow: hidden; height: 270px; width: 245px;background:#fafafa;color:000;"></iframe><span><center>
<a style="color:#a8a8a8;font-size:8px;" href="http://www.allblogger.tips/2014/11/how-to-add-facebook-floating-like-box.html">Fb Floating Like Box </a></center>
</span></div>
</div>
<!--Floating Facebook Widget END--> 



Just Replace "MYCOMPUTERSIR"With Your Facebook Like Box.

Copy This All code And Goto Blogger.com And Open Your Blog's Layout And Add a New Gadget ,And Choose HTML CODE .Then Paste This code There., And Drag the gadget on the Side Of Your Layout, And CLik On SAVE ARANGMENTS


DOn't Forget To say Thankx

Regards:
Syed Ali Haider Gillani

LIKE US ON FACEBOOK

Comment Here If any Problem :>>>






No comments:

Post a Comment