php - 动态 Google 加一个 +1 按钮（带有更改的网址）

Question

我有一个带有照片库的网站，我希望加一个按钮指向照片页面而不是画廊本身，这意味着当用户翻阅图像时我需要动态更改它。这样做的正确方法是什么？

Answer 1

在 head 标签中写下：

// Load +1 script
(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 代码：

<div id="plusone_container">

</div>

并在任何你想设置 +1 按钮的 url 的地方写下这个 jQuery：

    $("#plusone_container").html('<div id="plusone"></div>');
    gapi.plusone.render("plusone", { "href": "Your URL" });

Answer 2

从官方文档：

设置 +1 目标网址

+1 的 URL 按以下顺序确定：

1. 按钮的 href 属性 此属性明确定义 +1 目标 URL。
2. 页面标签 如果未提供 +1 按钮的 href 属性，Google 将使用该页面的规范 URL。有关为页面定义规范 URL 的更多信息，请参阅此帮助文章。
3. document.location.href 提供的 URL，不推荐使用。如果这些项目都不存在，Google 将使用在 DOM 中找到的页面 URL。由于此 URL 可能包含会话 ID、锚点或其他实际上不属于规范 URL 的参数，因此我们强烈建议您为 +1 按钮设置 href 属性或向您的页面添加标签。

假设您有一组代表不同照片的标签。让我们假设每张照片都由以下内容表示：

<div class="single-photo">
    <img/>
    <a href="http://single.photo.com/path">My photo</a>

</div>

添加 +1 按钮的最简单方法就是这样做：

<div class="single-photo">
    <img/>
    <a href="http://single.photo.com/path">My photo</a>
    <div class="g-plusone" data-href="http://single.photo.com/path" data-other-parameter="other-parameter-value"></div>
</div>

Answer 3

通过创建显式呈现的按钮并更改规范链接的 href 解决了该问题。如果没有向按钮提供 url，它会从规范链接属性中获取它的 url，然后通过重新渲染它，我可以让它每次都指向不同的 url。