Google+のボタン設置で、Validではないタグ

↓WordpressサイトをW3Cのバリデータでチェックしたときの話。

The W3C Markup Validation Service

Google+の+1ボタンを設置していたのですが、Googleの指示通りにやっていたにも関わらずエラー判定。
ちょっとどういうこと?と思ったら、私が使っていたコードはもうすでに古いらしく、新しいコードに変わっていました。

↓+1ボタンの設置コード取得

+1 Button – Google+ Platform — Google Developers

使っていた古いコード

↓これをヘッダ内に設定

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

↓ボタンを表示したい場所に設置
<g:plusone size="medium"></g:plusone>

これだと、バリデータで↓こんな風に怒られます。

capture

新しいコード

<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone" data-size="small"></div>

<!-- Place this tag after the last +1 button tag. -->
<script type="text/javascript">
  window.___gcfg = {lang: 'ja'};

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

これでエラーが出なくなりました。

Googleですら、こんな緩い感じだったの?

HTML5&CSS3, 備忘録 | , , |