Menu
I am new to facebook api, so I don't know if this is a newbie question. What I did is I followed after Quick Start
I put the following snippet at the open tag of <body> (with my-app-id replaced, 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 at the place where I want the like button to appear:
<div
class="fb-like"
data-send="true"
data-width="450"
data-show-faces="true">
</div>
This is the result of the 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 omitted the query and src part. I don't understand why it rendered with 0 width and 0 height. Both parent and self div are not styled to hidden. Please tell me what am I doing wrong?
842
It's hard to give an answer without seeing the entire code, but it may be because of the following:
You are using http instead of https and due to this, Facebook is not allowing your request to go through. Running your script gives the following error in the browser console upon running:
Mixed Content: The page at 'https://jsfiddle .net/v98vq53r/' was loaded over HTTPS, but requested an insecure script 'http://connect.facebook.net/en_US/sdk.js'. This request has been blocked; the content must be served over HTTPS.
199
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
