Google分享显式加载

时间:2013-01-21 13:34:12

标签: google-plus share

思想: 加载动态内容后,在鼠标悬停时我正试图像官方谷歌开发者网站上所说的那样呈现谷歌分享按钮。

我正在使用的代码是:

gapi.plus.render(div);

事实:

  • 如果我将plus更改为plusone,则会使用google plus按钮代替共享。 (意思是:脚本加载)
  • 如果我删除{“parsetags”:“explicit”},按钮加载(但不会在悬停时加载)

问题: 分享按钮无法加载。

使用plus.render和plusone.render建立链接:

  1. http://romanlosev.igloro.info/googleshare.php?load=plusone(加一个 - 工作,但加+按钮加载)
  2. http://romanlosev.igloro.info/googleshare.php?load=plus(加 - 不起作用)

1 个答案:

答案 0 :(得分:7)

有一个类似的问题on StackOverflow here

您需要做的是为共享按钮调用显式呈现方法。用以下代码替换选择div的函数将延迟屏幕上共享对象的渲染。

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

要渲染单个按钮,必须将action对象设置为share的对象传递,例如:

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

以下是一个更完整的示例,它执行异步脚本加载并呈现各种共享目标,可见here

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