Поделиться результатами викторины на Facebook

Я потратил часы, исследуя это, но для многих разработчиков это кажется сложным. У меня небольшая опрос php, выводя результаты из формы следующим образом:

if (maxA) {
   echo '
   <img src="imgs/result4.jpg"/>
   <div class="results2">
   <p class="title">You are a Bean</p>
   <p class="details">Description</p>
   </div>';
}

Вопрос заключается в том, как добавить кнопку "Поделиться" в нижней части этой страницы, которая будет делиться результатами на Facebook вместе с описанием и рисунком. Обратите внимание, что есть четыре доступных результата.

Я сделал публичное приложение и вставил в голову следующее:

<script>
window.fbAsyncInit = function() {
FB.init({
  appId      : '1382290368762081',
  xfbml      : true,
  version    : 'v2.3'
});
};

(function(d, s, id){
 var js, fjs = d.getElementsByTagName(s)[0];
 if (d.getElementById(id)) {return;}
 js = d.createElement(s); js.id = id;
 js.src = "//connect.facebook.net/en_US/sdk.js";
 fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>

И HTML еще предстоит выяснить. Я пошел туда и обратно с этим ответом: Использование "share_open_graph" Facebook, чтобы создать динамический диалог для показа результатов викторины - но на самом деле ничего не добился. Я думаю, что это было бы полезно для всего сообщества, если кто-то знает, как именно это произойдет, и поделиться им с нами.

Ответы

Ответ 1

Для этого вы можете использовать для этого facebook js SDK. вы можете вызвать фид метода FB.ui для этого. Создайте кнопку на своей странице

<input type="button" onclick="postToFeed()" value="Share" />

. Используйте нижеследующую функцию javscript для совместного использования на facebook.

function postToFeed() {
    // calling the API ...
    var obj = {
      method: 'feed',
      link: 'https://www.azeezkallayi.com/',
      description: "description goes here",
      picture: 'https://www.azeezkallayi.com/demo/test/womens-day.jpg',
      name: 'International womens day'       
    };
     FB.ui(obj);
   }

Здесь вы можете изменить значения параметров, как вы хотите.

Ответ 2

В дополнение к ответу @Azeez: несмотря на комментарий @CBroe, нет необходимости создавать четыре URL-адреса для каждого из разных результатов. Лучший способ справиться с этой ситуацией - поделиться Facebook с помощью диалога Feed (аналогично, но не так, как, диалог Share - Метод Share не может быть изменен и вместо этого извлекает информацию из метатег на странице).

Затем вы можете использовать Javascript SDK (с вашим идентификатором приложения), чтобы открыть новый диалог Фид, заполненный совершенно уникальными элементами. Например:

    // Facebook Share
    $('#facebook-share').on('click', function(e){
        e.preventDefault();

        FB.ui({
            method: 'feed',
            link: 'http://www.example.com/Quiz/',
            picture: '<?= $FacebookShareImage; ?>',
            name: 'This is a headline',
            caption: 'example.com',
            description: 'Your longer description goes here'

        }, function(response){
            if (response) {
                console.log('Facebook post published.');
                showThankYou();
            } else {
                console.log('Facebook post was not published.');
            }
        });
    });

Вы можете прочитать о остальных доступных атрибутах вышеупомянутую страницу документации по диалоговому окну.