How to load google plus share button in iframe?

Can anyone give me a solution on How can I load the Google plus share button (not the +1 button) in an iframe asynchronously. I have managed to do that for the +1 button.

回答1:

Try this html snippet:

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

回答2:

If what you're trying to do is explicitly render the button when a user hovers over something, what you need to do is use the explicit render flow as described here:

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

However, there's a twist, because you're using a share button, you can't use the explicit render code to render directly to the div. Instead, you will create your share link, set the render to explicit, and then can use JavaScript to trigger the rendering of the share button.

The relevant code is:

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

For you, I am guessing that you're trying to use a different trigger for rendering your +1 button than a button the user explicitly has to click, you could just use the appropriate event for what you want to trigger the render.