Geek Answers Handbook

Facebook like a button with 0 width and 0 height?

I am new to facebook api, so I don't know if this is a newbies issue. I did it after a quick start.

I put the following snippet in an open <body> (with replacement my-app-id, of course)

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

and I have the following snippet in the place where I want a button like:

 <div class="fb-like" data-send="true" data-width="450" data-show-faces="true"> </div>

This is the result of rendering:

 <div class="fb-like fb_iframe_widget" data-send="true" data-width="450" data-show-faces="true" fb-xfbml-state="rendered" fb-iframe-plugin-query="..."> <span style="vertical-align: top; width: 0px; height: 0px; overflow: hidden;"> <iframe name="f246b6fae4" width="450px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:like Facebook Social Plugin" src="..">...</iframe> </span> </div>

I missed the request and the src part. I do not understand why this was done with a width of 0 and 0. Both the parent and the independent div are not hidden. Please tell me what am I doing wrong?

+7
javascript html facebook
source share
1 answer

It is difficult to give an answer without seeing all the code, but maybe because of the following:

You use http instead of https, and because of this, Facebook does not allow your request to pass. Running the script results in the following error in the browser console on startup:

Mixed content: the page at https: // jsfiddle .net / v98vq53r / 'was loaded via HTTPS, but requested an unsafe script' http://connect.facebook.net/en_US/sdk.js '. This request is blocked; content must be transmitted via HTTPS.

+1
source share

More articles:


All Articles