fb-comments loader image does not disappear - facebook

I have this simple html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns:fb="http://ogp.me/ns/fb#" xmlns:og="http://ogp.me/ns#">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<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 = "http://connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
The comments list shows incomplete, and the loader images never stops nor disappear. What can be going on
Thanks

I've found that adding OpenGraph tags to the page fixes the issue. It seems that the tags are used by Facebook to link back to the Comments on the page. I've also seen the issue appear in local environments, but resolve themselves when hosted.

Related

Social plugin doesn't load only in IE

I have a prolem with IE when i using the social facebook plug in.
This is my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">
<head>
....
</head>
<body>
<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/it_IT/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
...
</body>
And when i need to show the social plugin in my page, use this code from facebook
<fb:like-box href="http://www.facebook.com/pages/MYPAGE" colorscheme="dark" show_faces="true" header="false" stream="false" show_border="false"></fb:like-box>
This code work done in Firefox, Chrome, Opera but not on IE11.
I have tried to use this:
<html xmlns:fb="http://ogp.me/ns/fb#">
But, also in this case, IE doesn't show the plugin, all other browser yes.
Why is this??

Facebook Like button issue in IE8

I've got this code for the Facebook like button on an HTML page, taken directly from the FB developer site:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
<title>FB Like button test</title>
</head>
<body>
<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>
<fb:like href="http://developers.facebook.com/docs/reference/plugins/like" send="false" layout="button_count" width="90" show_faces="true"></fb:like>
</body>
</html>
When I look on Firefox or other non-IE browsers, I see a normal looking Like button, like this:
{Like} <[1.5m]
However, when I look at the same page on IE8, it doesn't show the like count, it seems to ignore the width="90", and I just end up with a long string like this:
{Like} Be the first of your friends to like this.
What's going on?

fb comments - cannot see the full widget anymore

Since yesterday, I cannot see the full widget for comments from facebook. I have a website with articles, and for every article, a fb comments widget. First, I've thought it was a problem of layers or something, but i've created a new file and same problem is happening.
The code is:
<html>
<head>
</head>
<body>
<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=386320764714835";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments" data-href="http://steagu.ro/index.php?id=2806&cat=1" data-num-posts="5" data-width="630"></div>
</body>
</html>
You can see it in action here.
I've test it on Firefox 16.0.1 and also in IE 9.0.7
Any idea what's wrong?
include this line :
<html xmlns:fb="http://ogp.me/ns/fb#">
Use this Code and check
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns:fb="http://ogp.me/ns/fb#">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<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=386320764714835";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments" data-href="http://steagu.ro/index.php?id=2806&cat=1" data-num-posts="25" data-width="630"></div>
</body>
</html>

like button comment show not appearing

I want make comment box work on my page after like. I don't know what i do wrong.
My code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
<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/pl_PL/all.js#xfbml=1&appId=282750891760090";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<?php
<fb:like href=\"myurl"\" send=\"false\" layout=\"button_count\" width=\"90\" show_faces=\"false\"></fb:like>
?>
og:tags
<meta property="og:title" content="Foczky" />
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Foczky" />
<meta property="fb:admins" content="100000432662947" />
I'm not much of a php expert, but wrapping your fb:like html inside of tags doesn't seem like it would work too well. Also, your HTML is missing and tags too.

simple fbml fb:login-button is not rendering in ie6

The following codes works in FF and Chrome, but IE6 does not render the connect button.
What am I missing here?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title></title>
</head>
<body>
<fb:login-button>Login button</fb:login-button>
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"></script>
<script type="text/javascript">
FB_RequireFeatures(["XFBML"], function(){
FB.Facebook.init("API_KEY", "/xd_receiver.htm");
});
</script>
</body>
</html>
Seems the problem is with the Maxthon browser and not the straight forward IE6.
Replace the javascript to this one:
<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_GB/all.js#xfbml=1&appId=261463080590982";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>