2

我正在开发一个电子商务网站，其中购物车页面需要所有产品项目的 Facebook 分享按钮，并具有以下要求：-

假设购物车页面中有 4 个产品项目 - “p1”、“p2”、“p3”和“p4”。

  1. 当用户点击“p4”项目的“分享”按钮时，如果他没有登录FB，他将被要求登录。这已使用“ fb:login-button”FBML 标签完成。

  2. 登录后，用户将能够在我的网站的弹出窗口中提供自定义消息。该弹出窗口还将包含“p4”项目的产品名称以及图像。

  3. 当用户单击“共享”/“提交”按钮时，带有“p4”项目的产品名称和图像的消息将被发布/发布在用户的 Facebook 墙上。第 2 点和第 3 点都是使用FB.initJavaScript SDK 的“”和“FB.ui”核心方法完成的。

  4. 现在在我的网站上，购物车页面将显示“p4”商品的 Facebook 分享已完成，因此即使页面再次刷新或更多此类产品时，也不会再出现“Facebook 分享”按钮被添加到购物车。在这里，我无法禁用“共享”按钮。

  5. 用户将能够单击其他产品“p1”、“p2”和“p3”的“共享”按钮。但是共享消息的弹出窗口将显示相应产品的产品名称和图像，而不是最后一项“p4”。但是，这里的弹出窗口始终只提供最后一项“p4”的信息。相反，我真正想要的是 Facebook Share 功能的多个实例。

对于第 4 点和第 5 点，我特别需要帮助。

4

3 回答 3

5

我无法在第 4 号中解决您的问题，但我认为您尝试做的事情就像动态创建一个 facebook 共享器链接并适当地设置它一样简单。

我已经创建了一个jsfiddle可以做到这一点，看看这里，看看是否对你有帮助。

代码的核心是一个简单的 jQuery 事件处理程序，它配置 facebook 共享器的 url 和一些参数，给定以下 html：

<ul class="products">
    <li id="product-1">
        Awesome Snacks 
        <a class="sharer" href="http://www.yoursite.com/some/url/to/product-1" data-title="Awesome Snacks on Website!">
            <span class="liketext">Share</span>
        </a>
    </li>
</ul>

以及以下 jQuery 事件处理程序定义：

$('.sharer').click(function(e) {
    e.preventDefault();

    var title = $(this).data('title');
    var url = $(this).attr('href');    
    var fbSharerUrl = 'http://www.facebook.com/sharer.php?';
    var params = { u: url, t: title };
    var fbSharerConfig = 'toolbar=0,status=0,width=600,height=400';

    window.open(fbSharerUrl + $.param(params), 'sharer', fbSharerConfig);
});

这将根据购物车中链接的 href 和 data-title 属性为您动态生成一个 facebook 共享链接。

看看我之前链接的jsfiddle，因为它还包含一些 CSS 以使链接看起来像 facebook 共享按钮 :)

于 2011-06-28T04:48:06.867 回答
4

如果我错了，请纠正我，但使用 iframe-Share-button 不能解决你所有的问题吗？

于 2011-06-27T10:05:29.550 回答
1

Facebook 不允许您使用共享按钮共享自定义文本/图像，如果您需要这样做，在共享 URL 中，提供产品详细信息页面的 URL 而不是列表页面，并在该产品详细信息页面中设置元数据。

其他选项是为所有产品设置通用元数据。

这是解释 Facebook 可以理解的元数据的链接

http://grafikdesign.wordpress.com/2010/02/10/facebook-sharespecifying-meta-tags-fbml-audio-flash-video-action-bar/

于 2011-07-04T07:18:09.273 回答