Facebook “like” buttons are pretty easy to implement – if you have a straight forward site. If you are loading your content using AJAX or some other form of delayed load, you might notice a problem if you’re not using Facebook’s iframe. FBML users have probably noticed that when loading “like” buttons using AJAX that they don’t show up. There’s any easy fix for this.
First a little background information. What’s happening is this: Facebook is waiting for the DOM to load and then begins parsing the FBML. This is all fine an dandy except that when you make an AJAX call, this doesn’t cause the FBML to be re-parsed. So the fix is simple, make Facebook parse again after you’re AJAX content has been inserted into the DOM.
The method to call is:
[codesyntax lang=”javascript”]
FB.XFBML.parse();
[/codesyntax]
If you’re using jQuery, there’s a real easy and slick solution to this problem:
[codesyntax lang=”javascript”]
$(document).ajaxComplete(function(){ try{ FB.XFBML.parse(); }catch(ex){} });
[/codesyntax]
This way, all AJAX complete events that occur on the page will have an additional parse called tacked on to the end of them. That’s all there is to it. Hopefully this helps someone out there.
It did help indeed. Thank you