Facebook comments plugin flashes then goes blank - facebook

I was wondering if anyone else was having any issues with the facebook moderation tool or the comments plugin to be specific.
I just got this all set up and working this morning, but tonight the comments plugin loads, i see the comments for a split second and then the whole div goes blank...
Even when i check on the developer page to create code for the button, same thing, it flashes the comments and then goes blank. here https://developers.facebook.com/docs/plugins/comments
heres a simple page i made just to test.
<!doctype html>
<html>
<head>
<html lang="en">
<meta charset="utf-8">
<head prefix="og: http://ogp.me/ns#">
<meta property="og:title" content="'.$title.'">
<meta property="og:url" content="https://www.dudermang.com/test.php" />
<meta property="og:image" content="https://www.dudermang.com/blog/logo.jpg" />
<meta property="og:description" content="just a test" />
<meta property="fb:app_id" content="814183725332896" />
<title>testing</title>
<meta name="description" content="'testing shit'">
<meta name="author" content="CFaulk">
<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">
</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/sdk.js#xfbml=1&version=v2.3&appId=814183725332896";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<h2>This is a test</h2>
<p>
<div class="fb-comments" data-href="https://www.dudermang.com/test.php" data-numposts="5" data-colorscheme="dark"></div>
</p><p>
<div class="fb-comments" data-href="https://www.dudermang.com/test.php" data-version="v2.3"></div>
</p>
</body>
</html>
I cant seem to figure this out. am I doing something wrong or is FB experiencing an issue? I looked at another blogger that uses this and i can see the number of comments but the actual comments are gone so i assume this is just broken for everyone?
thanks in advance.

Related

Facebook Not Updating Like Description

I am having trouble implementing the Like Description for one of my projects I am developing on my local machine. My problem was the I can only get the Title and Url to appear in the Like Description and it was missing the Image and the Text. I created a blank page with just a Like button and uploaded it onto a public server and noticed that I am unable to update the contents inside the Like Description.
For example, if you go to my test page below and click the Facebook Like button, you will see the Like Description description as 'Page description, expected to output'. However, if you view the page source, you will see that I have set the description with the Meta OG tag as <meta property="og:description" content="This is a new page description"/>. The current description tag is what I first used when I created this page.
So my question is why can I not update the Like Description? Does Facebook cache this somewhere on their server? If so, do you know how long it is cached for? In addition, will this work if I tested on my local?
http://www.sfu.ca/~jca41/stuph/test.html
<head>
<meta property="og:url" content="http://www.sfu.ca/~jca41/stuph/test.html"/>
<meta property="og:image" content="http://www.placehold.it/320x200/">
<meta property="og:description" content="This is a new page description"/>
<meta property="og:title" content="Site title"/>
<meta property="og:type" content="game"/>
<meta property="og:site_name" content="Site name"/>
<meta property="fb:admins" content="690014395"/>
</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>
<div class="fb-like" data-href="http://www.sfu.ca/~jca41/stuph/test.html" data-send="true" data-width="450" data-show-faces="false"></div>
</body>
Facebook has a tool called Debugger, this tool fetches the latest content, and also updates it cache with the latest content: https://developers.facebook.com/tools/debug
This should help.

Unreachable URL, on Facebook comments plugin. App ID is the right one... not sure what to do

http://www.escapingaspinningroom.com/photos/photo/193
is a web page where I have the comment iFrame on. Litteraly, the only things that change on the page are the description, and image id. Everything else is virtually the same.
http://www.escapingaspinningroom.com/photos/photo/192
this page displays the error. I don't know what I'm doing wrong here.
here are my meta tags:
<meta property="og:type" content="easroom:photo" />
<meta property="og:title" content="Escaping A Spinning Room | Photo" />
<meta property="og:image" content="<?php echo URL . "images/" . $photo->url ?>" />
<meta property="og:description" content="<?echo $photo->disc?>" />
<meta property="og:url" content="http://www.escapingaspinningroom.com/photos/photo/<? echo $this->picid?>" />
<meta property="fb:app_id" content="{36532270688XXXX}"/>
and what they look like on the on my web page (X is there on purpose),
and this is what they look like on the finished page
<meta property="og:type" content="easroom:photo" />
<meta property="og:title" content="Escaping A Spinning Room | Photo" />
<meta property="og:image" content="http://www.escapingaspinningroom.com/images/13479919974.jpg" />
<meta property="og:description" content="Barry looking at the city after a long night of drinking. Actor Michael Souto." />
<meta property="og:url" content="http://www.escapingaspinningroom.com/photos/photo/189" />
<meta property="fb:app_id" content="{36532270688XXXX}"/>
<meta charset="utf-8">
This is located right after the <body> tag
<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=36532270688XXXX";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
And here is where the comments code is.
<div class="fb-comments" data-href="http://www.escapingaspinningroom.com/photos/photo/<? echo $this->picid ?>" data-num-posts="4" data-width="310" data-colorscheme="dark"></div>
I tried using their debugger tools, but it won't scrape my website.
I'm having a lot of trouble with these facebook comments. If you guys have any great alternatives, and not Disqus, that would be great. free too lol
First off, your value for fb:app_id is incorrect, you have
<meta property="fb:app_id" content="{365322706881496}"/>
It should be
<meta property="fb:app_id" content="365322706881496"/>
Try fixing that and see if Facebook's Debug Tool can access the page correctly afterwards

face like button replacing actual og:url

I seem to be missing something very important in implementing Facebook like buttons to my article based website.
Everything seems to be configured correctly according to the Facebook debugger. But when I actually try to "like" a post, the true url get's replaced with the facebook url. For example, I am liking a post http://www.mysite.com/post/1 , for some reason mysite is being replaced with "facebook", so I end of liking http://www.facebook.com/post/1 . That is how it is showing up both when you hit the like in the modal and on my facebook wall.
Here are my tags
<meta property="og:title" content="My Site"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="<?php echo "http://www.mysite.com/posts/{$post->id}" ?>"/>
<meta property="og:image" content="http://www.mysite.com/media/logo.png"/>
<meta property="og:site_name" content="My Site"/>
<meta property="fb:admins" content="XXXXXXXX"/>
<meta property="fb:app_id" content="XXXXXXXXXXXXXXX"/>
<meta property="og:description" content="<?php echo text::limit_words($post->content, 20, '...'); ?>"/>
All the urls are showing correct in the Linter, so I can't figure this out.
Thanks
Is there a relative URL in the data-href="URL" in your actual LIKE button code in the page? e.g. I use the facebook like button code as follows, using the og tags set up like you have above:
<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>
<div class="fb-like" data-href="<?php echo "http://www.mysite.com/posts/{$post->id}" ?>"> data-send="false" data-count="false" data-layout="button_count" data-width="47" data-show-faces="false"></div>

Facebook Like Buttom with count don't update de count

i have this facebook page: LINK
And i want to implement multiple facebook like button on product page on site: LINK
When i click on "Like" Buttom, this aways shows "1" and when refresh the page, this count disapear.
for my product page i use:
<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/pt_BR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
and for buttons:
<div class="fb-like" data-href="http://www.calcadosabruzzo.com.br/2012/catalogo/1402.html" data-send="false" data-layout="button_count" data-width="85" data-show-faces="false" data-font="segoe ui"></div>
for each phantom pages for the products i use these meta tags:
<!doctype html>
<html xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraph.org/schema/">
<head>
<title>Calçados Abruzzo - Ref.: 1402</title>
<meta property="og:title" content="Calçados Abruzzo - Ref.: 1402" />
<meta property="og:type" content="product" />
<meta property="og:url" content="http://www.calcadosabruzzo.com.br/" />
<meta property="og:image" content="http://www.calcadosabruzzo.com.br/2012/produtos/1402_5122_Marrom_montila.jpg" />
<meta property="og:site_name" content="Calçados Abruzzo" />
<meta property="fb:app_id" content="100002115061810" />
<meta http-equiv="refresh" content="0;url=http://www.calcadosabruzzo.com.br/2012/catalogo.html">
</head><body></body></html>
i dont know where to get the APP_IP becouse the client make his page on facebook and dont make an APP
when i put the product page on Facebook Debug, show me these errors: LINK
How to solve this? Its the first time i use this Plugin...
I managed to find few reports on this behaviour. I seems Facebook introduced a bug because even their reference where you can create like button gives errors. What people suggested is to make an app through developers.facebook.com/apps
Get the app_id from there and in the app settings under App Domain add your website (calcadosabruzzo.com.br).
For fb:admins you should add the app admin id (probably yours).
Hope this helps.

Can't get the facebook like button to work using open graph

I'm trying to use Facebook open graph to customize my send and like display, but it's not working and I have no idea why.
Here's my header in header.php:
<!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>
<title>AskSanta - <?php echo $title; ?></title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="author" content="" />
<meta name="distribution" content="global" />
<meta name="copyright" content="Copyright © 2011 by JustAskSanta. All rights reserved." />
<meta name="description" content="Content to be written here" />
<meta name="keywords" content="Keywords to be written here" />
<meta property="og:title" content="Ask Santa Online" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://www.justanswersanta.com" />
<meta property="og:image" content="http://www.justanswersanta.com/images/santa.png" />
<meta property="og:site_name" content="Ask Santa Online" />
<meta property="og:description" content="Hey kids (or kids at heart)! Want to ask Santa a question? Brought to you from the North Pole by JustAnswer."/>
Here's the like button in thankyou.php;
<?php include("header.php"); ?>
<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>
<div class="fb-like" data-href="http://www.justanswersanta.com" data-send="true" data-layout="button_count" data-show-faces="false" data-font="lucida grande"></div>
Here's the output:
http://www.justanswersanta.com/thankyou.php
What am I doing wrong?
Your codes and OG tags seem to be correct.
I think your page had been cached by Facebook with an earlier version.
Facebook has an object debugging tool and by this tool you can refresh cached page information: http://developers.facebook.com/tools/debug
I have explored your page with this link. By this way I refreshed your page cache. And now, your website is being scrapped correctly. Please check it.