7

我正在创建一个具有 g+ 共享按钮的页面，但我想动态更改要共享的内容的描述。要自定义共享按钮，我正在使用带有 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) {}

但是，分享按钮中的描述内容始终是初始的。

有谁知道如何使它工作？

编辑：

我在按钮 twitte 上遇到了同样的问题，但设法解决了这个问题：

        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();
4

2 回答 2

2

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

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

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

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

于 2012-08-10T23:18:26.013 回答
1

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

于 2012-08-10T23:46:31.250 回答