Question

我之前已经问过这个问题，但我觉得我的情况略有不同。

我有一个网站，我在每个页面上都是一个全局的按钮，基本上“喜欢”该网站。现在我有一个页面上有一堆照片，如果你点击每一页，它会弹出一个花哨的盒子。

这是页面上的html。这些图像中的每一个都会在点击时显示相应的标题。

<a href="/image1.jpg" class="zoom img">
    <img src="/image1.jpg" width="150" height="100" />
</a>    

<a href="/image2.jpg" class="zoom img">
    <img src="/image2.jpg" width="150" height="100" />
</a>    

<a href="/image3.jpg" class="zoom img">
    <img src="/image3.jpg" width="150" height="100" />
</a>                    


<div id="fancyboxTitles" style="display: none"> 

    <div>title1</div>                                             
    <div>title2</div>
    <div>title3</div>

</div>

我想要做的是在每个特定图像的精美框中都有一个相似的按钮，所以当有人点击“赞”时，该特定图像将显示在Facebook上。

目前我正在使用iframe方法和我的全局按钮的元标记。

Answer 1

我对其他问题（http://facebook.stackoverflow.com/questions/9252899/fancybox-with-share-buttons-linked-to-unique-image）的回答仍然适用。

您将需要一种基于唯一URL的机制来提供正确的http://ogp.me og：meta标签，以便由Facebook的linter解析。

请记住，linter不运行javascript，因此需要在响应流中正确定义它们。

修改

具有自己的URL的每个图像的示例。这些将有助于Facebook能够获得正确的html和og：标签。

http://example.com/images.php?id=1 http://example.com/images.php?id=2 http://example.com/images.php?id=3

在每个唯一URL的HTML响应中，指定了正确的og：标记。在该HTML中，您应该将javascript重定向到实际页面以显示图片。由于javascript不会被linter运行，因此linter应该能够读取那些og：标签。

有关如何指定og标记，请参阅http://ogp.me。

如何在1页面上添加多个类似facebook的按钮？

1 个答案: