Пользовательская интеграция с Facebook - PullRequest
2 голосов
/ 24 июня 2011

Я работаю над сайтом электронной коммерции, на странице которого в корзине покупок должна быть кнопка «Поделиться в Facebook» для всех товаров, со следующими требованиями: -

Предположим, что на странице корзины покупок есть 4 товара - «p1», «p2», «p3» и «p4».

  1. Когда пользователь нажимает кнопку «Поделиться» для элемента «p4», ему будет предложено войти в систему, если он не вошел в FB. Это было выполнено с использованием тега "fb:login-button" FBML.

  2. После входа в систему пользователь сможет предоставить пользовательское сообщение во всплывающем окне на моем веб-сайте. Это всплывающее окно также будет содержать название продукта для элемента "p4" и изображение.

  3. Когда пользователь нажимает кнопку «Поделиться» / «Отправить», сообщение с названием и изображением продукта для элемента «p4» будет опубликовано / опубликовано на стене пользователя в Facebook. Обе точки # 2 и # 3 были выполнены с использованием основных методов "SDK JavaScript" * FB.init "и" FB.ui ".

  4. Теперь на моем веб-сайте на странице «Корзина покупок» будет показано, что для элемента «p4» общий доступ к Facebook завершен, поэтому кнопка «Поделиться на Facebook» больше не будет, даже когда страница обновлена. снова или когда больше таких продуктов будет добавлено в корзину. Здесь я не могу выполнить отключение кнопки «Поделиться». Пожалуйста, помогите мне здесь.

  5. Пользователь сможет нажать кнопку «Поделиться» для других продуктов «p1», «p2» и «p3». но во всплывающем сообщении «Поделиться» будет отображаться название продукта и изображение для соответствующих продуктов, а не для последнего элемента «p4». Однако здесь всплывающее окно всегда предоставляет информацию только для последнего элемента «p4». Вместо этого я хочу использовать несколько экземпляров Facebook Share. Пожалуйста, помогите мне здесь.

Я упомянул проблемы в вышеупомянутых пунктах, и я страдаю в пунктах # 4 и # 5.

Пожалуйста, помогите мне всем, и спасибо всем заранее. Пожалуйста, спросите меня, требуется ли дополнительная информация.

Ответы [ 3 ]

5 голосов
/ 28 июня 2011

Я не могу решить вашу проблему в номере 4, но я думаю, что вы пытаетесь сделать так же просто, как динамически создать ссылку на Facebook и поделиться ей соответствующим образом.

Я создал jsfiddle , который делает именно это, посмотрите здесь и посмотрите, поможет ли это вам.

Суть кода - это простой обработчик событий jQuery, который конфигурирует URL для общего ресурса Facebook и некоторых параметров.с учетом следующего 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);
});

Это создаст для вас ссылку на общий доступ на Facebook динамически на основе href и data-titleатрибуты ссылок в вашей корзине покупок.

Взгляните на jsfiddle , на который я ссылался ранее, поскольку он также включает в себя некоторые CSS, чтобы ссылки выглядели как кнопки общего доступа на Facebook:)

4 голосов
/ 27 июня 2011

Поправьте меня, если я ошибаюсь, но разве использование кнопки iframe-Share не решит все ваши проблемы?

1 голос
/ 04 июля 2011

Facebook не позволяет вам делиться пользовательским текстом / изображениями с помощью кнопки «Поделиться», если вам нужно сделать это, в URL-адресе общего доступа укажите URL-адрес страницы сведений о продукте вместо страницы списка и задайте метаданные на этой странице сведений о продукте.

Другой вариант - установить общие метаданные для всех продуктов.

Вот ссылка, объясняющая, какие метаданные Facebook может понять

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

...