将文字设置为谷歌+分享按钮

时间:2012-08-04 00:22:29

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

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

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

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

2 个答案:

答案 0 :(得分: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>
  3. 然而,这将影响计数。如果您将此技术与+1按钮一起使用,则每个描述将被视为不同的页面,并且计数将单独累积。

答案 1 :(得分:1)

我知道Facebook会为描述和其他元素缓存信息。似乎根据this link,Google +也是如此。似乎它被无限期地缓存了......这使得你的情况几乎不可能,这取决于你想要改变内容的频率。要么那么,要么等几天,看看它是否确实发生了变化。我想要指出,珍妮也是正确的,但经过这一切,你很可能仍然无法获得理想的结果。