在我的頁面上添加新的Facebook喜歡按鈕後，它不再使用XHTML嚴格標準進行驗證。這兩個錯誤，我遇到有：新Facebook像按鈕HTML驗證
在類似的按鈕行中使用的所有變量列出，沒有它的屬性。該行如下所示：
<fb:like href="http://www.pampamanta.org" layout="button_count" show_faces="false" width="120" action="like" font="arial" colorscheme="light"></fb:like>
這裏是不是交換的文檔類型的解決方案：
由於zerkms建議，加入了「FB」命名空間僅適用於「FB」的屬性。元標記的「屬性」屬性保持無效的XHTML。
如你所知，Facebook的建立在RDFa的合規性，所以你可以使用下面的文檔類型：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
使用RDFa帶來比在大多數情況下，簡單的FB問題的修復更多的問題雖然。
作爲_timm建議，動態地將元標記寫入dom沒有任何意義。這些fb元標籤的主要用途之一是FB-bot解析「共享」或「我喜歡」的目標頁面（動作頁面），爲facebok牆貼自動填充人羣提供自定義標題，圖像和錨標籤。考慮到這一事實，並且考慮到facebook肯定使用簡單的頁面提取來讀取所提供的html響應，而沒有任何解析javascript所注入的相關元標記的能力，所以預期的功能將會失敗。
現在，有一個非常簡單的修復提供了一個XHTML驗證和成功解析Facebook之間的折中：在html註釋中包裝facebook元。繞過w3c解析器，Facebook仍然識別元標記，導致它忽略評論。
<!--
<meta property="og:image" content="myimage.jpg" />
<meta property="og:title" content="my custom title for facebook" />
-->
你確定facebook解析註釋之間的代碼嗎？ – user478419 2010-12-05 11:08:54
我剛剛在我的網站上測試了Facebook元註釋解決方案，它工作正常。 Facebook仍然閱讀meta標籤，即使它們被註釋掉了。我的頁面現在通過W3C進行驗證。好的解決方案 – mitchf 2011-01-16 03:14:04
我剛剛測試了這一點，Facebook忽略了這些評論並恢復爲從DOM獲取數據。對於任何想要測試他們獲取數據的人，這裏是[FB's Linter]（https://developers.facebook.com/tools/lint）。 – patridge 2011-04-14 16:43:12
您是否試過添加xmlns:fb="http://www.facebook.com/2008/fbml"？
您可以通過document.write將html標籤嵌入到腳本中。 http://www.tymsh.com/2010/06/25/sitenize-facebook-like-begen-butonu-ekleyin/這裏以一個例子來說明如何做到這一點。
這不是一個好主意，因爲類似按鈕可以工作，但是當facebook來索引你的頁面時，它不會運行javascript'document.write'，所以它不會看到標籤 – rtpHarry 2011-03-18 11:17:37
只要是任何人使用評論方法的後續行動。 Facebook目前正在評論評論，因此在評論中包裹元屬性標籤會導致Facebook忽略它們。如果您使用Facebook URL Linter檢查您的頁面，您可以看到它們不使用註釋掉的元標記。
@Eric我希望你最終找到你要找的東西。
如果您想要使開發人員能夠驗證而不考慮XHTML Strict 1.0或HTML5，則Twitter整合有其困難。另一方面，Facebook的自定義FBML標籤是不可能的。
在我們的最後一個項目我的朋友傑森，我知道肯定兩兩件事：
解決方案是使用靈活的異步JavaScript模塊。值得慶幸的是，我們有一些幫助和指導沿途：http://techoctave.com/c7/posts/40-xhtml-strict-tweet-button-and-facebook-like-button
我最近使用：
<script type="text/javascript">
document.write('<fb:like href="http://www.mywebsite.co.uk" layout="button_count" show_faces="true" width="100"></fb:like>');
</script>
，它似乎做工精細，哪怕是有點臭。
好吧，經過幾百個這些帖子後，我終於找到了一個快速簡單的方法來獲得一個有效的頁面上有一個Like按鈕（或任何其他Facebook小部件）。
的代碼只是一個fewlines真的，看看http://www.liormark.com/develop/development-articles/facebook-fbml-w3c-validation-solved
爲了將來打樣，本頁面上的代碼是： – jsims281 2011-02-07 10:10:09
對於劑量誰使用"<javascript... document.write...「文件撰寫不是一個有效的DOM的過程，以便在火狐和Chrome，如果你在一個XML使用/嚴格的XHTML與內容類型爲文本/ XML不起作用
有效DOM的形式給出，對我的作品：。
<div id="FbCont">
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1" type="text/javascript"></script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
var fb = document.createElement('fb:like');
fb.setAttribute("href","http://www.cirugia-obesidad.mx");
fb.setAttribute("layout","button_count");
fb.setAttribute("show_faces","true");
fb.setAttribute("width","100");
fb.setAttribute("font","arial");
document.getElementById("FbCont").appendChild(fb);
//--><!]]>
</script>
</div>
希望這會爲別人打工
韋爾奇
RE：Welcho
找到腳本類型是造成對我一個錯誤（XHTML 1.0過渡）。也添加給那些可能會錯過的人。
你的是最好的，也是最容易使用的，我在網上看到的日期。再看一遍 - 哈！你是最好的:)
歡呼和thnks :)
<div id="fb-root"></div>
<div id="FbCont">
<script type="text/javascript"
src="http://connect.facebook.net/en_US/all.js#appId=XYOURIDXyourapID=1">
</script>
<script type="text/javascript">
<!--//--><![CDATA[//>
<!--
var fb = document.createElement('fb:like');
fb.setAttribute("href","http://www.wakawakblahblah.com");
// fb.setAttribute("layout","button_count");
fb.setAttribute("send","true");
fb.setAttribute("action","recommended");
fb.setAttribute("show_faces","false");
fb.setAttribute("width","280");
fb.setAttribute("font","trebuchet ms");
document.getElementById("FbCont").appendChild(fb);
//--><!]]>
</script>
</div>
從今天開始，你也可以使用兼容HTML5的標記
例如而不是
<fb:like href="example.org">
你可以做
<div class="fb-like" data-href="example.org">
由於數據 - *屬性在HTML5
這裏是一個很好的解決方案是有效的。如果你打算使用文檔。寫使用它，如下所示，它會完美驗證
<script type="text/javascript">
//<![CDATA[
(function() {
document.write('<a href="https://twitter.com/share" data-count="vertical" data-via="siteripe">Tweet</a>');
var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
s.type = 'text/javascript';
s.async = true;
s.src = 'http://platform.twitter.com/widgets.js';
s1.parentNode.insertBefore(s, s1);
})();
//]]>
</script>
總是註釋掉。
爲FB：像
<script language="javascript" type="text/javascript">
//<![CDATA[
document.write('<fb:like href="http://www.c-p-p.net" layout="button_count" show_faces="false" width="90" action="like" font="arial" colorscheme="light"></fb:like>');
//]]>
</script>
也是元數據在頭
<!--
<meta property="og:title" content=" some title" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://c-p-p.net/" />
<meta property="og:image" content="site image" />
<meta property="og:site_name" content="site name" />
<meta property="og:description" content="description text" />
<meta property="fb:admins" content="some number" />
-->
修復的javascript標記添加類型= 「文本/ JavaScript的」
<script type="text/javascript">(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_EN/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
，爲IFRAME版本
<script language="javascript" type="text/javascript">
//<![CDATA[
document.write('<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%..... allowTransparency="true"></iframe>');
//]]>
</script>
它的作品在我的網站http://c-p-p.net
我用這個代碼，它是有效的W3C驗證。
<script type="text/javascript">
<!--//--><![CDATA[//><!--
document.write('<fb:like href="http://www.pampamanta.org" layout="button_count" show_faces="false" width="120" action="like" font="arial" colorscheme="light"></fb:like>');
//--><!]]>
</script>
這裏是純粹的解決方案（技巧），使任何標籤或未經確認的代碼驗證！
我使用smarty作爲模板引擎，但是如果您不使用smarty，也可以使用相同的方法！
我認爲更多的是一個技巧而不是解決方案（因爲目前還沒有人），只是簡單地通過不向W3C驗證器顯示那些元字符串來通過驗證。
當Validator引用我的頁面時，使用PHP，我不呈現W3C Validator無法識別的內容。我只需通過提取W3C Validator發送的頭文件信息來做到這一點，W3C Validator是用戶代理，它是W3C_Validator /版本。
創建PHP函數並將其分配給Smarty：
function User_Agent_Check($user_agent) {
$user_agent_check = strpos($_SERVER['HTTP_USER_AGENT'], $user_agent);
if ($user_agent_check === false) {
return false;
} else {
return true;
}
}
然後讓我們來檢查用戶代理：
if (User_Agent_Check("W3C_Validator")) {
$smarty->assign('W3C', "1");
} else {
$smarty->assign('W3C', "0");
}
然後在Smarty的模板使用（如果你不」使用Smarty只是用PHP回顯內容）：
{if $W3C == 0}
<meta property="og:url" content="">
<meta property="og:title" content="">
<meta property="og:description" content="">
<meta property="og:type" content="video">
<meta property="og:image" content="">
<meta property="og:video" content="">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="1920">
<meta property="og:video:height" content="1080">
<meta property="og:site_name" content="">
<meta property="fb:app_id" content="">
<meta name="twitter:card" content="">
<meta name="twitter:site" content="">
<meta name="twitter:player" content="">
<meta property="twitter:player:width" content="1920">
<meta property="twitter:player:height" content="1080">
{/if}
當Validator嘗試檢查您的頁面時，那些元標記僅輸出到頁面！當任何其他用戶代理正在看你的頁面時，那些代碼就像往常一樣輸出！您可以爲Facebook Like Button或任何OG Metatags做到這一點 - 實際上可以做任何其他事情。
這恰好是我的時代精神正確的解決方案！
我有一個解決方案。只需要在JS和document.write中包裝標籤即可。 http://nerdramblings.tumblr.com/post/3213578636/html5-and-facebooks-fbml J. –
user1137834
2011-02-10 08:17:38