Menu
I have a Facebook Like button on my site and as such also have the xmlns:fb attribute on the <html> tag:
<!DOCTYPE html>
<html lang="en" xmlns:fb="http://www.facebook.com/2008/fbml">
However, when running my site through the W3C validator, I get these errors:
Line 2, Column 61: Attribute xmlns:fb not allowed here.
Line 2, Column 61: Attribute with the local name xmlns:fb is not serializable as XML 1.0.
Line 222, Column 72: Attribute fb:like:layout is not serializable as XML 1.0.
Line 222, Column 72: Attribute fb:like:layout not allowed on element a at this point.
It is my understanding that using the xmlns:fb attribute adds fb to the document namespace, so that using any <fb: element is valid. Is that not the case? Is it a HTML5 issue?
I also have similar validation errors with the Twitter button, is it possible to fix those as well?
Line 223, Column 53: Attribute tw:via is not serializable as XML 1.0.
Line 223, Column 53: Attribute tw:via not allowed on element a at this point.
567
Or you can now use prefix mappings.
<!DOCTYPE html>
<html lang="en" prefix="fb: http://www.facebook.com/2008/fbml">
There is no way to validate xmlns:fb with HTML5.
However, you can use the new data-...-attributes, which were added by Facebook and are valid HTML5, as described here.
This is an example of how you can use this extension in HTML5 (assume all code is in the body element):
<h3>Members</h3>
<embed data-fb="login-button" data-show-faces="true" />
<h3>Recent activity</h3>
<embed data-fb="activity" data-site="***" data-width="200" data-header="false"
data-border_color="#fff" data-recommendations="false" />
<div id="fb-root"></div>
<!-- the JavaScript API -->
<script src="http://connect.facebook.net/en_US/all.js"></script>
<!-- the extention script from this article -->
<script src="/scripts/fb.js"></script>
<script>
//<![CDATA[
FB.init({apiKey: '***', appId: '***', status: true, cookie: true, fbml5: true});
//]]>
</script>
This would be the equivalent XHTML code:
<h3>Members</h3>
<fb:login-button show-faces="true" />
<h3>Recent activity</h3>
<fb:activity site="***" width="200" header="false"
border_color="#fff" recommendations="false" />
<div id="fb-root"></div>
<!-- the JavaScript API -->
<script src="http://connect.facebook.net/en_US/all.js"></script>
<!-- the extention script from this article -->
<script src="/scripts/fb.js"></script>
<script>
//<![CDATA[
FB.init({apiKey: '***', appId: '***', status: true, cookie: true, fbml5: true});
//]]>
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
