Пользовательская интеграция Facebook Share

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

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

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

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

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

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

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

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

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


javascript facebook php facebook-javascript-sdk facebook-fbml
person Knowledge Craving    schedule 24.06.2011    source источник
comment
Неужели нет никого, кто может хотя бы ответить на некоторые пункты?   -  person Knowledge Craving    schedule 27.06.2011
comment
Пожалуйста, поделитесь некоторым кодом, например, как вы добавляете кнопки общего доступа и что-нибудь еще, что может быть полезно.   -  person Niklas    schedule 27.06.2011
comment
Если бы вы могли поделиться кодом, это было бы полезно.   -  person Shameer    schedule 02.07.2011

Ответы (3)


arrow_upward
1
arrow_downward

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

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

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

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

person Sandeep Manne    schedule 04.07.2011
comment
Ваш вариант выглядит более жизнеспособным для обдумывания и реализации, чем другие. - person Knowledge Craving; 04.07.2011

arrow_upward
5
arrow_downward

Я не могу решить вашу проблему в номере 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, чтобы ссылки выглядели как кнопки поделиться в фейсбуке :)

person David Mosher    schedule 28.06.2011
comment
хорошая работа :) вы действительно полезны. Изменение yoursite.com с каждой реальной ссылкой на продукт работает отлично. - person Joby Joseph; 30.06.2011

arrow_upward
4
arrow_downward

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

person daniel.herken    schedule 27.06.2011
comment
Я считаю, что это будет самое простое решение в данном случае. - person red; 27.06.2011