Clicking Facebook Like button reloads the page
I'm trying to add Facebook Like-buttons to a site I've built. The site contains "hints & tips" for using different products my company sells. Each such "hint" should be possible to "Like".
The problem is that when I click the Like-button, the page reloads.
In Firefox 4 on Mac, I get into an infinite reload loop, where every reload calls up a Facebook popup window, that closes again, and then the page reloads again etc etc.
In Chrome and Opera on Mac, the page only reloads once. It then seems to forget that I liked the page.
The "hints" are displayed on separate pages, so I don't have multiple Like-buttons on any single page.
I'm using the XFBML syntax, but I have also tried using the iFrame version, with the same result.
<fb:like href="http://www.vissteduatt.com/tips?hint_id=120" layout="button_count" show_faces="false" width="50" font="verdana"></fb:like>
You can see the page at http://www.vissteduatt.com/tips?hint_id=120 - the Like-button is not displayed though, since it doesn't work correctly and the site is live.
The reason I have specified an href attribute on the fb:like tag is that there are also other attributes in the URL, and these might change. Therefore I "normalise" the URL to only include what is necessary.
After googling quite a bit for the solution to this problem, I found mentions that the href can be used to redirect a user clicking on the Like-button to another page, like the application's Facebook Wall. I thought this might be the reason for t开发者_StackOverflow中文版he reload, but nothing changed when I removed the href attribute.
I'm using the async init code for javascript:
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: '146368105420237', status: true, cookie: true, xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol + '//connect.facebook.net/sv_SE/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
Any help would be greatly appreciated!
UPDATE:
This seems to be a known issue ever since Firefox 3.6(!)There seems to be no workaround other than the user allowing third party cookies from Facebook. I've tried this, and it does stop the infinite loop. There are still some problems with a single reload however, and these occur in Firefox, Chrome and Opera alike.
I haven't been able to test in IE, because my IE8 at work simply won't load the Like-button at all.
See link below for a discussion on the topic:
http://www.facebook.com/topic.php?uid=14696440021&topic=16716UPDATE:
I found the solution to the Like-button not showing up in IE here: Facebook like button showing in Firefox but not showing in IENow the button behaves the same in IE as in other browsers. Still get the reload/reset of the button after "Liking" a page.
精彩评论