41

そのため、Google の +1 ボタンを自分の Web サイトで取得しようとしていじっていましたが、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>

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

編集：これを検証に合格させるために、私は自分のウェブサイトに記事を書きました。

4

12 に答える 12

24

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

Google が HTML の代わりにタグスープを使用するように設計したため

これを準拠させるにはどうすればよいですか？

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

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

HTML 4.x または XHTML 1.x で動作させたい場合は、運が悪いかもしれません (ただし、JS を使用して非準拠のマークアップを追加できるかもしれませんが、それはそれを隠すためのハックにすぎません)。検証であり、有効なマークアップの精神ではまったくありません)

于 2011-06-02T16:42:51.540 に答える
11

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

<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>

完全な答えはここにあります（フランス語）

于 2011-06-23T14:09:05.503 に答える
9

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

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

つまり、

<html xmlns:g="http://base.google.com/ns/1.0"> ... </html>
于 2011-06-02T16:45:03.800 に答える
6

検証するGooglePlusOneコードを作成する最も簡単な方法：次のように入力します。

<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」などのパラメーターを追加できます。

于 2011-06-12T14:13:38.947 に答える
2

これを試して：

<div class="g-plusone" data-size="standard" data-count="true"></div>
于 2011-06-19T15:58:52.383 に答える
2

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>

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

于 2011-07-05T18:11:32.283 に答える
1

その単純な

divタグ内で以下を使用して、ページ内の任意の場所に配置できるように構成できます。これは有効です。

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

私はそれを私たちのウェブサイトwww.armaven.comで使用しています。見てみな。お望みならば。

于 2011-07-30T14:29:35.810 に答える
1

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>
于 2011-07-20T18:42:22.293 に答える
0

もう 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
>
于 2012-01-04T23:17:56.253 に答える
0

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

<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 スクリプトへのリンクまたはその他のリンクがあることを確認してください。

于 2012-02-16T20:40:55.363 に答える
0

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

<div class="g-plusone" data-size="standard" data-count="true"></div>
于 2015-01-26T15:18:06.527 に答える
0

私が実装したソリューションは既にこのスレッドに存在し、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/。幸運を！

于 2012-07-20T11:38:47.430 に答える