如何加载iframe中的google plus share按钮?

时间:2012-05-21 07:20:44

标签: javascript google-plus google-plus-one

任何人都可以给我一个解决方案如何异步加载iframe中的Google plus分享按钮(而不是+1按钮)。我已经设法为+1按钮做到了。

2 个答案:

答案 0 :(得分:12)

试试这个html代码段:

<iframe src="https://plusone.google.com/_/+1/fastbutton?bsv&amp;size=medium&amp;hl=en-US&amp;url=http://test.com/&amp;parent=http://test.com/" allowtransparency="true" frameborder="0" scrolling="no" title="+1"></iframe>

答案 1 :(得分:2)

如果您尝试做的是在用户悬停在某物上时显式渲染按钮,您需要做的是使用显式渲染流程,如下所述:

https://developers.google.com/+/plugins/+1button/

然而,有一个转折,因为您使用的是共享按钮,您无法使用显式渲染代码直接渲染到div。相反,您将创建共享链接,将呈现设置为显式,然后可以使用JavaScript来触发共享按钮的呈现。

相关代码是:

<html>
  <head>
    <title>+Share: Explicit render</title>
    <link rel="canonical" href="http://www.example.com" />
    <script type="text/javascript">
    window.___gcfg = {
      lang: 'en-US',
      parsetags: 'explicit'
    };
    function renderShare() {
      gapi.plus.go(); // Render all the buttons
    }
    </script>
  </head>
  <body>
    <a href="#" onClick="renderShare();">Render the share control</a>
    <!-- a share button that will get rendered when gapi.plus.go is called -->
    <div class="g-plus" data-action="share" id="share-div"></div>
  </body>
  <script type="text/javascript">
    // Asynchronously load the plusone script, for performance
    (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>
</html>

对于你,我猜你正在尝试使用不同的触发器来渲染你的+1按钮,而不是用户明确必须点击的按钮,你可以使用适当的事件来触发渲染