Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

The "fb-root" div has not been created, auto-creating

I am using FB like button on my webpage, sometimes it render and sometimes its not, When I see console for Error Log it showing error

The "fb-root" div has not been created, auto-creating

in all.js I am using this 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_US/all.js#xfbml=1&appId=105911812857824";
        fjs.parentNode.insertBefore(js, fjs);
    } (document, 'script', 'facebook-jssdk'));
</script>


<div class="fb-like" data-send="false" data-width="450" data-show-faces="true">
                    </div>
like image 804
Syed Salman Raza Zaidi Avatar asked Jun 18 '13 13:06

Syed Salman Raza Zaidi


2 Answers

Use this following 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_US/sdk.js#xfbml=1&appId=694586437259261&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

and also put this code also

<div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>

You have to provide data-href="your link for like" that will work for you.

like image 159
Deepak Avatar answered Sep 27 '22 18:09

Deepak


There's a newer way to initialize the API.

You can put the appId in the init method instead of embedded in the URL.

They don't even suggest you use fb-root anymore. In fact I don't really see why you ever needed to. You'll still get a warning in the console but I don't see any reason to worry about putting it in manually.

<script>

   window.fbAsyncInit = function() {
     FB.init({
       appId      : 'your-app-id',
       xfbml      : true,
       version    : 'v2.3'
     });
   };

   (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/sdk.js";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));

</script>
like image 42
Simon_Weaver Avatar answered Sep 27 '22 19:09

Simon_Weaver