【问题标题】:set text to google+ share button将文本设置为 google+ 分享按钮
【发布时间】:2012-08-15 02:32:31
【问题描述】:

我正在创建一个带有 g+ 分享按钮的页面,但我想动态更改要分享的内容的描述。自定义分享按钮,我使用的是 snippet 和 Open Graph 协议。

我尝试过的解决方案如下,但无法正常工作:

<meta property="og:title" content="O Fabuloso Gerador De Lero Lero v3" />
<meta property="og:image" content="images/robot.png" />
<meta property="og:description" content="..." />
$('meta[property="og:description"]').attr('content',text);

var shareButtons = $('div:first','section.share-buttons');
shareButtons.html('');
shareButtons
    .prepend('<a href="https://twitter.com/share" class="twitter-share-button" data-text="' + text.trunc(120,true) + '" data-url="http://goo.gl/1KHFM" data-lang="pt">Tweetar</a>')
    .prepend('<div class="g-plus" data-action="share" data-href="http://lerolero.miguelborges.com/t=' + new Date().getTime() + '" data-annotation="bubble"></div>');

try {
    window.twttr.widgets.load();
    window.gapi.plus.go();
} catch(e) {}

但是,分享按钮中的描述内容始终是首字母。

有人知道如何让它工作吗?

编辑:

我在按钮推特上遇到了同样的问题,但设法解决了这个问题:

        shareButtons
            .prepend('<a href="https://twitter.com/share" class="twitter-share-button" data-text="' + text.trunc(120,true) + '" data-url="http://goo.gl/1KHFM" data-lang="pt">Tweetar</a>');

        window.twttr.widgets.load();

【问题讨论】:

标签: javascript share facebook-opengraph google-plus code-snippets


【解决方案1】:

您的页面的 sn-p 是由您的页面的服务器端提取生成的。页面提取器不执行 JavaScript。这就是您对该元素所做的更改未在您的分享中表达的原因。

您可以使用 get 参数并指定目标来解决此问题。

  1. 将您的页面配置为接受描述作为 GET 参数。例如,http://exmaple.com?desc=foobar 会使您的 Open Graph 标记看起来像这样:&lt;meta property="og:description" content="foobar" /&gt;
  2. 当您呈现您的分享链接、分享按钮或 +1 按钮时,使用 GET 参数指定的所需描述定位页面。对于分享按钮,您的标记可能如下所示:&lt;div class="g-plus" data-action="share" data-href="http://example.com/?desc=foobar"&gt;&lt;/div&gt;

但是,这会影响计数。如果您将此技术与 +1 按钮一起使用,则每个描述都将被视为不同的页面,并且计数将单独累积。

【讨论】:

  • 感谢您的回复。不幸的是我不能使用GET参数,因为描述的内容会通过点击一个按钮来改变,我不能刷新页面。
  • 听起来我不清楚。您实际上不必在 Web 浏览器中更新当前 URL。而是删除当前的共享按钮并呈现一个新的共享按钮,该按钮以 GET 参数为目标。
  • 我添加了属性data-href,但是现在sn-p,不行。
  • 如果您的描述长于一个单词,并带有空格怎么办。这个方法坏了。并因此而无用。
  • 如果某个字符不能在 URI 中,则 URI 对其进行编码。空格是 %20
【解决方案2】:

我知道 Facebook 会缓存描述和其他元数据的信息。根据this link 看来,Google + 也是如此。似乎它被无限期地缓存了......这使您的情况几乎不可能,具体取决于您想要更改内容的频率。要么这样,要么等几天,看看它是否会改变。我想指出,Jenny 也是正确的,但是在经历了这些之后,您很可能仍然不会得到理想的结果。

【讨论】:

  • 旁注:设置 GET 变量将被识别为每个描述的单独页面,因此它可能不会缓存...但是,请务必转义您通过 URL 传递的任何内容。另外,像描述这样长的东西应该缩短,以免超出任何可能的浏览器限制stackoverflow.com/a/417184/628859
  • 感谢您的回复。不幸的是我不能使用GET参数,因为描述的内容会通过点击一个按钮来改变,我不能刷新页面。
  • @MiguelBorges 在这种情况下,在 Google 发布通过 API 刷新缓存的方法之前,缓存页面描述将使您的项目几乎不可能完成
猜你喜欢
  • 2018-10-28
  • 1970-01-01
  • 1970-01-01
  • 2016-10-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-04-01
相关资源
最近更新 更多