I am working on this site for a client: http://djzimmie.com/2012/03/08/miss-march-2011/
The linter says everything is okay, but when I go to like the page, I click like, and don't leave a comment, it doesn't show that I've liked it on my Facebook page. If I type in a comment, and then post, it shows up fine. I'm not sure what the problem is.
Any suggestions?
Okay here is some info:
Here is my namespace code:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://ogp.me/ns/fb#">
Here is a link to the linter that shows that everything is okay: http://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fdjzimmie.com%2F2012%2F03%2F08%2Fmiss-march-2011%2F
Here is the code I am using right inside my 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=158780564242930";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
And then last but not least the button code:
<fb:like send="false" layout="button_count" width="100" show_faces="true" font="arial"></fb:like>
As mentioned, I cant get the like button to show without leaving a comment. Any help would be greatly appreciated.
Followup to this was that FB was acting up....I went back to this a couple days later and it was working as expected
Related
1st please don't mark my question as a duplicate one because I read all the questions related but none of the questions stated my hint.
I was trying to make a facebook like button and found that facebook like box is more what I need because it just like and doesn't show any post after like.
The idea is when I take the code from the like box plugin link it doesn't add the like to the facebook page as other said that it was a bug in the facebook like. But when I press the button inside that link it will add the like to the facebook page.
The question is if it is a facebook bug should they state the first field as "Facebook Page URL" and should it work in the plugin link while you are configuring the like box before you get the code???
In other words, if it work in the plugin link so it must work if you get the code and paste it in your site, or am I wrong??
I've tried the HTML5, XFBML and IFRAME code that the facebook generate for you according to the data you provide.
No one of the below codes work; It shows the like box and when you click it will change to grey color but it doesn't make a like to the facebook page and when I refresh the test page it returns to the default state. When I was trying I found that the if I like the page from facebook site in normal way and try to dislike using the below code fro test page it will work.
EDIT:
While I am still trying to find a solution I found that in explorer works sometimes while in chrome and firefox doesn't.
I am using a test.html file that is placed in htdocs of xampp to test the result.
HTML5 code tried:
<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_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like-box" data-href="http://www.facebook.com/FacebookDevelopers" data-width="150" data-height="100" data-colorscheme="light" data-show-faces="false" data-header="false" data-stream="false" data-show-border="false"></div>
</body>
</html>
XFBML Code tried:
<html xmlns:fb="http://ogp.me/ns/fb#">
<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_GB/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<fb:like-box href="http://www.facebook.com/FacebookDevelopers" width="150" height="100" colorscheme="light" show_faces="false" header="false" stream="false" show_border="false"></fb:like-box>
</body>
</html>
and the Iframe Code tried:
<html>
<head></head>
<body>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FFacebookDevelopers&width=150&height=62&colorscheme=light&show_faces=false&header=false&stream=false&show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:150px; height:62px;" allowTransparency="true"></iframe>
</body>
</html>
Ok I'm sure this has been addressed somewhere, but as it currently stands I couldnt figure out the solution or find one on google....
I am implementing Facebook's comments box and my code is essentially a copy-paste of what is on the site
<!DOCTYPE html>
<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=417087715031519";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
</body>
<div class="fb-comments" data-href="file:///A:/commentsbox.html" data-width="470"></div>
</html>
Problem is that when I log in from my account and comment, I can see my comments, when I log in from another test account, I can only see that test accounts comments, and when I log in from another test account, again I can only see its comments. What am I doing wrong?
Note that I currently have this up on localhost and my APP is in test mode.
It seems I had a fundamental misunderstanding when asking this question. Test users cant view each others comments (which is how I was testing the comments box)..
I am tring to implement the comments box into my website, providing the 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/all.js#xfbml=1&appId=204934639590323";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments" data-href="http://my_web.com/" data-num-posts="2" data-width="500"></div>
When i post a message into the comments box, that message is not posted onto my wall. Also, when i logout from fb, that message dissapers. Hope to give me some ideas. Thanks.
If you logout of Facebook and then the comment disappears it seems a privacy configuration on your account, that's why when you become anonymous Facebook hides the comment.
Also, if the comment is not posted (despite you check you want this behavior on the comment box) maybe your app is in sandbox mode OR again you have specific configurations for this app.
To quickly have a better idea of what is going on you could ask someone else to comment.
Hope that helps.
Im having problems using the Facebook social plugins. If its important, I use GWT to display the code inside an HTML widjet
I put this in my html
<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:comments width="600" num_posts="2" href="http://www.woojah.com"></fb:comments>
And nothing is displayed. However, if I open the source code with firebug, and I cut that code and paste it again, it is displayed. It is as if that code needs a special "refreshing" or "reloading". By the way, I got that code from the developers.facebook.com page. It's the social plugin comment code.
Also my html tag is <html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="https://www.facebook.com/2008/fbml">
So my question is: Does anyone know why the comment plugin is not displayed and why, when I cut and paste the exact same code with firebug it is displayed.
You may want to look into using the FB.XFBML.parse() command to have the SDK reparse the page after you use GWT to insert the code inside your widget.
I'm trying to add a facebook like button to my extension.
I've already added a google +1 button but I seem to be having some trouble with the facebook button.
This is the code generated by https://developers.facebook.com/docs/reference/plugins/like/
(Modified the source of the all.js file to be local instead)
<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 = "all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="https://chrome.google.com/webstore/detail/bkonffiagffjhnihbboojciggcplmobc" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>
It doesn't show up at all on my extension, and I'm not exactly sure why.
Any tips would be great!
Thanks
The original src value for my like button was something like //connect.facebook.net/en_US/all.js#appId=<number>&xfbml=1. In a chrome extension, this url is extended to chrome-extension://connect.facebook.net/en_US/all.js#appId=<number>&xfbml=1, which will 404. The simple fix is to prepend the original src value with the http protocol, http://connect.facebook.net/en_US/all.js#appId=<number>xfbml=1.
I do not know the specifics of all.js, I can't say if embedding it in your extension will be useful.
(I ran into this same issue and thought I would leave my answer here for others.)