web-dev-qa-db-ja.com

Google +1ボタンはW3Cに準拠していません

だから私は自分のウェブサイトでそれを得ようとするGoogleの+1ボタンで遊んでいますが、それはW3Cに準拠していません。

これがコードです：

<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
  {lang: 'en-GB'}
</script>

<!-- Place this tag where you want the +1 button to render -->
<g:plusone size="medium" href="http://www.example.org"></g:plusone>

なぜこれが起こり、これを準拠させる方法を誰かが知っていますか？ありがとう

編集：これを検証に通過させるために、私は website に記事を書きました。

javascriptw3cw3c-validationgoogle-plus-one
41
ingh.am

なぜこれが起こるのか誰か知っていますか？

GoogleがHTMLではなくタグスープを使用するように設計したため

これを準拠させる方法は？

documentation には、HTML 5仕様のドラフトで有効な代替マークアップがあります。

<div class="g-plusone" data-size="standard" data-count="true"></div>

HTML 4.xまたはXHTML 1.xで動作するようにしたい場合、運が悪い可能性があります（JSを使用して非準拠のマークアップを追加することはできますが、それはそれを隠すためのハックにすぎません）検証であり、有効なマークアップの精神ではまったくありません）

24
Quentin

このコードをヘッダーに挿入します。

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
      {lang:'en', parsetags:'explicit'}
</script>

次に、ボタンを配置する場所に次のコードを挿入します。

<div id="plusone-div" class="plusone"></div>

<script type="text/javascript">
      gapi.plusone.render('plusone-div',{"size": "small", "count": "true"});
</script>

完全な答えは次のとおりです here （フランス語）

11
Gilbou

XHTMLを検証しようとしていると思います。検証に成功するのに最も近いのは、これを追加して要素に「g」名前空間を定義することです。

xmlns:g="http://base.google.com/ns/1.0"

つまり、

<html xmlns:g="http://base.google.com/ns/1.0"> ... </html>
9
dossy

Google Plus Oneコードを検証する最も簡単な方法：次のように入力します：

<div class="g-plusone"></div>

の代わりに：

<g:plusone size="medium" href="http://www.example.org"></g:plusone>

欠点： 'count'や 'size'などのパラメーターを追加できないか、コードが無効になります。

これはGoogleが提案するHTML5のコードですが、他の（X）HTMLフレーバーでも機能します。 HTML5では、「data-count」、「data-size」などのパラメーターを追加できます。

6
Ricardo de la Vega

Bodyタグを閉じる前にコードを保持し、以下を置き換えます。

 <g:plusone size="medium"></g:plusone>

沿って ：

<div class="g-plusone" id="gplusone"></div>
<script type="text/javascript">
var ValidMe=document.getElementById("gplusone");
ValidMe.setAttribute("data-size","medium");
ValidMe.setAttribute("data-count","true");
</script>

いつものように、それはトリックをします...

2
SuN

これを試して：

<div class="g-plusone" data-size="standard" data-count="true"></div>
2
Xavier

その単純な

次のdivタグ内で使用します。これを構成して、ページ内の好きな場所に配置し、有効な場所に配置できます。

<div class="g-plusone"></div>

私のWebサイト www.armaven.com で使用しています。見てみな。お望みならば。

1
Magi

http://james-ingham.co.uk/posts?p=google-plusone-w3c-valid

<!-- Put inside the <head> tag. -->
<script type="text/javascript"
        src="http://apis.google.com/js/plusone.js">
    {lang: 'en-GB'}
</script>

<!-- Put where you wish to display button. -->
<script type="text/javascript">
    document.write('<g:plusone size="medium" href="http://www.example.org/post"></g:plusone>');
</script>
1
seo outsourcing

もう1つの方法は、私が行ったようにDTDをカスタマイズすることです。 xhtml1-strict.dtdをダウンロードしました

Dtdファイルで次のエンティティ定義を見つけます

<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc; )*">

次のように編集します（これにより、コンテキスト検証、つまりこのタグが表示される場所を解決するのに役立ちます）

<!ENTITY % Flow "(#PCDATA | %block; | form | %inline; | %misc; | g:plusone)*">

新しい要素を定義しています

<!ELEMENT g:plusone EMPTY>

そして、属性のリスト

<!ATTLIST g:plusone
  href %URI; #IMPLIED
  size CDATA #IMPLIED
>
0
Shoaib Nawaz

これは私が思いついた解決策です...

<span id="plusone"></span>
<script type="text/javascript">
    //< ![CDATA[    
       $("#plusone").html('<g:plusone></g:plusone>');
      (function() {
        var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
        po.src = 'https://apis.google.com/js/plusone.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
      })();
    //]]>    
</script>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>またはヘッダー内のjqueryスクリプトへの他のリンク！

0
Brandon

Quentinの answer に続いて、data-hrefを使用してW3C準拠のhref属性を追加できます。

<div class="g-plusone" data-size="standard" data-count="true"></div>
0
Jonathan

私が実装したソリューションはすでにこのスレッドにあり、Gilbouによって投稿されましたが、_<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>_はヘッダーに配置する必要がないことを追加する必要があります。

<div id="plusone-div" class="plusone"></div> <script type="text/javascript"> gapi.plusone.render('plusone-div',{"size": "medium", "count": "true", "href": "http://www.YOURSITE.com/"}); </script>

上記のコードを+1ボタンにする場所に配置しますが、_http://www.YOURSITE.com/_を+1するページのリンクに置き換えてください。他のパラメーターをgabi.plusone.render関数に追加する場合は、 https://developers.google.com/+/plugins/+1button/#plusonetag-parameters をチェックして、それがW3Cかどうかを確認します準拠 http://validator.w3.org/ に移動します。幸運を！

0
Andrei T