Facebook: Invalid mark up on FBML
Asked Answered
B

3

5

I am using the W3C XHTML validator to check my sites and I am getting some errors on pages with FBML. Most of the cause of such errors is the "&" character. Since FBML values and attributes are generated on the fly, I have no way to encode the character properly before displaying it.

Question: Is there a way for me to tell Facebook Connect to render the mark up properly?

Thanks.

Bowstring answered 16/6, 2010 at 13:7 Comment(0)
P
7

Try to put the facebook code in CDATA:

<script type="text/javascript">
/* <![CDATA[ */ 
document.write('<fb:login-button length="long" size="large" show-faces="true" perms="" onlogin="window.location=\'<?=current_url()?>\'"></fb:login-button>'); 
/* ]]> */
</script>
Parcenary answered 13/7, 2010 at 17:4 Comment(0)
T
2

In short, not as far as I know. To make matters worse, the fb:* tags don't validate either, even if you make your html tag look like this:

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="en" lang="en">

If this is a huge issue for you, you might be able to get away with putting non-XHTML-compliant markup in its own HTML-4.01-strict iframe, to basically sweep the crap under the rug.

This might be helpful:

http://wiki.developers.facebook.com/index.php/Facebook_Platform_for_Mobile:_XHTML

Some german guy also worked on it:

http://translate.google.com/translate?js=y&prev=_t&hl=en&ie=UTF-8&layout=1&eotf=1&u=http%3A%2F%2Fwww.ka-mediendesign.de%2Fblog%2Ffbml-in-xhtml-neue-version%2F&sl=de&tl=en

Tiki answered 17/6, 2010 at 1:20 Comment(0)
S
1

This is how i am doing it. Wrap around all fbml tags inside and then use js to simply uncomment the fbml code using javascript. Heres an example:

Markup:

<P class="fbreplace" style="display: none;">
    <!-- FBML
        <fb:like layout="standard" show_faces="false" colorscheme="light"></ fb: like>
    ->
</ p>

JS (JQuery Required):

$(document).ready(function() {
  $(".fbreplace").html.replace(/<!-- FBML /g, "");
  $(".fbreplace").html.replace(/ -->/g, "");
  $(".fbreplace").style.display = "block";
});
Selfdevotion answered 25/8, 2010 at 23:23 Comment(1)
This is interesting. There are better ways to do it but I just can't help but say that this is really interesting. And it works!Bowstring

© 2022 - 2024 — McMap. All rights reserved.