4

I am working on a Facebook App (iframe) and need to add an box at runtime in Javascript once I know what is the href to like (eg: the item to like changes based on selection on the page, etc).

Is there a way to create a box like this:

<fb:like href="http://example.com" send="true" action="recommend" width="360" layout="standard" show_faces="true" />

or its HTML5 equivalent:

<div class="fb-like" data-href="http://example.com" data-send="true" data-width="360" data-show-faces="true" data-action="recommend"></div>

in Javascript/jQuery at runtime?

I already tried using the iframe like box but it doesn't support "send" so it would be my fallback choice. The tag works well for me but I can't figure out how to change its href at runtime.

PS: I do include the Javascript SDK, have a logged in session, etc.

Any help is appreciated, Gionata Mettifogo

Pointy
  • 405,095
  • 59
  • 585
  • 614

1 Answers1

0

You can use facebook's Javascript API's setInnerFBML to set FBML objects dynamically on page.

Note that you have to pre-render the FBML string into an object.

You can read more about it here: https://developers.facebook.com/docs/fbjs/#fbml
and here: http://forum.developers.facebook.net/viewtopic.php?id=20157

Variant
  • 17,279
  • 4
  • 40
  • 65
  • does setInnerFBML work in canvas (iframe) apps? I tried but I get a javascript error that the method is not defined. I am including the Facebook JS SDK which works for other calls... – Gionata Mettifogo Nov 08 '11 at 14:41
  • 2
    I'm working on a canvas (iframe) app so it would be best not using FBML (which is not recommended). I found that you can add `` and then call `FB.XFBML.parse();` which will parse the document's DOM again and render the tag. It works quite well. – Gionata Mettifogo Nov 08 '11 at 20:19