关于 javascript：如何在 iframe 中加载 google plus 共享按钮？


How to load google plus share button in iframe?

谁能给我一个关于如何在 iframe 中异步加载 Google plus 共享按钮(不是 1 按钮)的解决方案。我已经设法为 1 按钮做到了这一点。

相关讨论

试试这个 html 片段：

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

如果您想要做的是在用户将鼠标悬停在某物上时显式呈现按钮，那么您需要做的是使用如下所述的显式呈现流程：

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

但是，有一个转折点，因为您使用的是共享按钮，所以不能使用显式渲染代码直接渲染到 div。相反，您将创建共享链接，将渲染设置为显式，然后可以使用 JavaScript 触发共享按钮的渲染。

相关代码为：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<html>
  <head>
    +Share: Explicit render
    <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
    }
   
  </head>
  <body>
    Render the share control
    <!-- a share button that will get rendered when gapi.plus.go is called -->
   
  </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);
    })();
 
</html>

对您来说，我猜您正在尝试使用不同的触发器来呈现您的 1 按钮而不是用户明确必须单击的按钮，您可以只使用适当的事件来触发渲染。

相关讨论