Question

我在我们的网站上使用JQuery Gallerific相册。 http://www.twospy.com/galleriffic/example-5.html

我想在此页面上实现Facebook Like按钮和Open Graph Protocol。

facebook喜欢按钮

<fb:like href="http://www.twospy.com/galleriffic/example-5.html" layout="button_count"></fb:like>

开放图协议

<meta property="og:url" content="http://www.twospy.com/galleriffic/example-5.html"/>
<meta property="og:image" content="http://farm4.static.flickr.com/3261/2538183196_8baf9a8015_s.jpg"/>

我想更改og：url和og：图片链接，当用户点击下一个按钮和前一个按钮到相应的页面链接时。

假设用户点击第5张图片，则开放图协议链接应更改为

<meta property="og:url" content="http://www.twospy.com/galleriffic/example-5.html#5"/>
<meta property="og:image" content="http://farm4.static.flickr.com/3150/2538167224_0a6075dd18_s.jpg" />

和类似的按钮需要更改为

<fb:like href="http://www.twospy.com/galleriffic/example-5.html#5" layout="button_count"></fb:like>

请让我知道是否有可能。这个问题的解决方案将拯救我的生命。请帮我解释一下代码。

谢谢。

Answer 1

我遇到了同样的问题。问题是社交网络“插件”（Facebook，Twitter，Google +等）都注入了他们工作的iframe。因此，更改页面的元信息发生得太晚了，因为它已被解析为构建iframe，之后被忽略，并且iframe内的任何JS都无法访问。我甚至尝试用iframe删除div并在更改元信息后重新添加它，但是第二次注入从来没有像第一次那样整齐地工作。

我使用的解决方案是我在Galleriffic onSlideChange（）方法中更新的“like”或“tweet”或“plus-one”按钮的老式链接。在对URL和标题进行编码后，更改a的href（假设它在下面的示例中具有“facebooksharer”的ID）：

$("facebooksharer").attr("href","http://www.facebook.com/sharer/sharer.php?u="+newUrl+"&t="+newTitle);

当然，你失去了在线计数和“朋友也喜欢”，但至少访客可以喜欢画廊中的确切图像。

在JQuery Galleriffic页面上实现Facebook Like Button

1 个答案: