1

アイデア：動的コンテンツが読み込まれた後、マウスオーバーで、公式のgoogle開発者のサイトにあるようにgoogle共有ボタンをレンダリングしようとしています。

私が使用しているコードは次のとおりです。

gapi.plus.render(div);

事実：

  • plusをplusoneに変更すると、代わりにgoogleplusボタンが共有されます。（手段：スクリプトが読み込まれます）
  • {"parsetags"： "explicit"}を削除すると、ボタンが読み込まれます（ただし、ホバーすると読み込まれません）

問題： 共有ボタンがロードされません。

plus.renderおよびplusone.renderを使用したリンクのデバッグ：

  1. http://romanlosev.igloro.info/googleshare.php?load=plusone（plusone-動作しますが、plus +ボタンがロードされます）
  2. http://romanlosev.igloro.info/googleshare.php?load=plus（プラス-機能しません）
4

1 に答える 1

7

StackOverflow here にも同様の質問があります。

必要なのは、共有ボタンの明示的なレンダリング メソッドを呼び出すことです。div を選択する関数を次のコードに置き換えると、画面上の共有オブジェクトのレンダリングが遅延します。

$("#clickme").click(function()
{
  gapi.plus.go();
});

個々のボタンをレンダリングするには、アクション パラメータを share に設定してオブジェクトを渡す必要があります。次に例を示します。

gapi.plus.render("plusOne", {action: "share"});

以下は、より完全な例です。非同期スクリプトの読み込みを行い、さまざまな共有ターゲットをレンダリングします。ここに表示されます。

<html>
<body>
  <p>
  <div data-action="share" class="g-plus" id="plusOne"></div>
  <button onClick="gapi.plus.render('plusOne', getParamBag('https://www.google.com'))"></button>
  </p>
  <p>
  <div data-action="share" class="g-plus" id="plusTwo"></div>
  <button onClick="gapi.plus.render('plusTwo', getParamBag('https://plus.google.com'))">  </button>
  </p>
  <p>
  <div data-action="share" class="g-plus" id="plusThree"></div>
  <button onClick="gapi.plus.render('plusThree', getParamBag('https://developers.google.com'))"></button>
  </p>
</body>
<script type="text/javascript">
  window.___gcfg = {
      lang: 'en-US',
      parsetags: 'explicit'
  };
  (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);
  })();
  function getParamBag(url){
    return {
      action: "share",
      href: url
    };
  }
</script>
</html>
于 2013-01-22T01:15:25.160 に答える