Earlier this month, we re-did the social bookmarking linkage on The Digital FAQ's forum (dumping vBulletin's idea of what Social Bookmarking should be, creating our own solution), and that included the use of the "new" Facebook Like button application, which required a Facebook application ID and extra coding to the site headers. Until today, it was fine**. The Recommend box was simply missing.
I checked a few other sites, including some very large ones, that use a similar setup in their forums. Same issue. In at least one case, another site was showing "Invalid Application" in a black Times font, instead of the proper box.
This was the code that powers the box on this site:
PHP Code:
<td width="100px" valign="top" align="left">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like layout="button_count" show_faces="false" width="100" action="recommend" font="arial"></fb:like>
</td>
Based off a similar but non-identical issue discussed in the Facebook dev forums, I saw a mention to add this to the code:
PHP Code:
<div id="fb-root"></div>
Which turns our code into this:
PHP Code:
<td width="100px" valign="top" align="left"><div id="fb-root">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like layout="button_count" show_faces="false" width="100" action="recommend" font="arial"></fb:like>
</div></td>
... and the Like box (or Recommend box, in our case) is back.
According to one FB dev forum member, this was always the "proper method" for using their code, but I can honestly say I've never seen it before. It sure as heck wasn't on the WYSIWYG developer tool on their site, which helps us create these buttons and boxes -- and I was there just two weeks ago. I don't know what crawled up somebody's butt at Facebook, but they seem to have willynilly changed the code again (server-side, on their end), and begun to "enforce" this so-called "proper" code use, without announcements before or after it was done. What a nuisance.
** IE excluded. Internet Explorer is choking on the new FB code, so we're using IE conditionals to block access to IE browsers. The older "Share" button is used for IE users -- again, by use of conditionals. **
