Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can we customize facebook likebox?

I am trying to customize the number of feeds and auto scroll functionality in Facebook likebox using below code.

<div id="fb-root"></div><script>(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return;js = d.createElement(s); js.id = id;js.src="//connect.facebook.net/en_IN/sdk.js#xfbml=1&appId=453991991316939&version=v2.0";fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>

enter image description here I have tried multiple canvas resize methods given in multiple websites but now getting stuck. Any ideas? how can I customize this or it will be great if someone have already created plugin for this?

like image 731
Gourav Makhija Avatar asked Nov 10 '22 21:11

Gourav Makhija


1 Answers

You need to copy the given below CSS code with Facebook Like Box code and paste it in your page.
You need to changee the url in iframe *************** to your facebook url.

    <style type="text/css">
     .f-bookMain {
        background-color:#E1E1E1; 
        width:320px; 
        border:1px solid #BCBCBC;
        padding:15px 0 15px 15px;
        height:280px;
      }
     .f-bookInnerBlock { 
        overflow:hidden;
         height:280px;
         border:1px solid #aaa;
      }
    </style>

    <div class="f-bookMain">
    <div class="f-bookInnerBlock">

    <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2F***************&amp;
    width=300&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;header=false&amp;stream=false&amp;
    show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" 
    allowTransparency="true">
    </iframe>

    </div>
    </div>

    <div id="fb-root"></div>
    <script>
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
    </script>

You need to changee the url in iframe *************** to your facebook url.
like image 119
skp Avatar answered Nov 14 '22 21:11

skp