自定义 Facebook 分享集成

发布于 2024-11-16 18:13:14 字数 786 浏览 2 评论 0 原文

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

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

当用户点击“p4”项目的“分享”按钮时，如果他没有登录FB，他将被要求登录。这是使用“fb:login-button”FBML 标记完成的。
登录后，用户将能够在我的网站的弹出窗口中提供自定义消息。该弹出窗口还将包含“p4”项目的产品名称以及图像。
当用户单击“共享”/“提交”按钮时，带有“产品名称”和“提交”的消息将被显示。 “p4”项目的图像将发布/发布在用户的 Facebook 墙上。第 2 点和第 2 点都是#3 已使用“FB.init”& 完成。 JavaScript SDK的“FB.ui”核心方法。
现在，在我的网站中，购物车页面将向我显示，对于“p4”商品，Facebook 共享已完成且已完成。因此，即使再次刷新页面或将更多此类产品添加到购物车中，也不会再有“Facebook分享”按钮。在这里，我无法禁用“共享”按钮。
用户将能够单击其他产品“p1”、“p2”和“p1”的“共享”按钮。 “p3”。但共享消息的弹出窗口将显示产品名称和名称。相应产品的图像和不适用于最后一项“p4”。然而，这里的弹出窗口始终仅提供最后一项“p4”的信息。相反，我真正想要的是 Facebook 共享功能的多个实例。

我特别需要第 4 点和第 4 点的帮助。＃5。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

千纸鹤带着心事 2024-11-23 18:13:15

我无法解决您在第四个问题中的问题，但我认为您想要做的就像动态创建 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 动态为您生成一个 facebook 共享器链接以及购物车中链接的数据标题属性。

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

I can't address your problem in Number 4 but I think what you're trying to do is as simple as creating a facebook sharer link dynamically and style it appropriately.

I've created a jsfiddle that does just that, take a look here and see if that helps you.

The guts of the code is a simple jQuery event handler that configures the url for the facebook sharer and some parameters, given the following 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>

And the following jQuery event handler definition:

$('.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);
});

This will generate a facebook sharer link for you dynamically based on the href and data-title attributes of the links in your shopping cart.

Take a look at the jsfiddle I linked earlier as it also includes some CSS to make the links appear like the facebook share buttons :)

回复收藏 0 原文