Подтвердить что ты не робот

Как добавить кнопку общего доступа к Facebook на моем веб-сайте?

У меня есть этот код, который предположительно работает, но не работает. Если это поможет вам в любом случае, это будет здорово.

<script src='http://connect.facebook.net/en_US/all.js'></script>
    <p><a onclick='postToFeed(); return false;'><img src="images/fb.png" /></a></p>
    <p id='msg'></p>

    <script> 
      FB.init({appId: "338334836292077", status: true, cookie: 

true});

      function postToFeed() {

        // calling the API ...
        var obj = {
          method: 'feed',
          redirect_uri:'https://www.facebook.com/cryswashington?fref=ts',
          link:'https://developers.facebook.com/docs/reference/dialogs/',
          picture: 'http://fbrell.com/f8.jpg',
          name: 'Facebook Dialogs',
          caption: 'Reference Documentation',
          description: 'Using Dialogs to interact with users.'
        };

        function callback(response) {

        document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
        }

        FB.ui(obj, callback);
      }

    </script>

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

Я много исследовал, но ничего не получил. Прошу помочь мне в этом.

Спасибо заранее.

4b9b3361

ОТВЕТЫ

Ответ 1

Вам не нужен весь этот код. Все, что вам нужно, это следующие строки:

<a href="https://www.facebook.com/sharer/sharer.php?u=example.org" target="_blank">
  Share on Facebook
</a>

Документацию можно найти на https://developers.facebook.com/docs/reference/plugins/share-links/

Ответ 2

Вы можете сделать это, используя асинхронный Javascript SDK, предоставленный facebook

Посмотрите на следующий код

Инициализация FB Javascript SDK

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'YOUR APP ID', status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement('script'); e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

Примечание. Не забудьте заменить свой идентификатор APP на ваш facebook AppId. Если у вас нет facebook AppId, и вы не знаете, как его создать, проверьте это

Добавить библиотеку JQuery, я бы предпочел Google Library

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

Добавить диалоговое окно общего доступа (вы можете настроить это диалоговое окно, настроив параметры

<script type="text/javascript">
$(document).ready(function(){
$('#share_button').click(function(e){
e.preventDefault();
FB.ui(
{
method: 'feed',
name: 'This is the content of the "name" field.',
link: 'http://www.groupstudy.in/articlePost.php?id=A_111213073144',
picture: 'http://www.groupstudy.in/img/logo3.jpeg',
caption: 'Top 3 reasons why you should care about your finance',
description: "What happens when you don't take care of your finances? Just look at our country -- you spend irresponsibly, get in debt up to your eyeballs, and stress about how you're going to make ends meet. The difference is that you don't have a glut of taxpayers…",
message: ""
});
});
});
</script>

Теперь, наконец, добавьте кнопку изображения

<img src = "share_button.png" id = "share_button">

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

Ответ 3

Подробнее о кнопке обмена вы можете прочитать здесь на сайте разработчиков Facebook

Работа JSFIDDLE

Также взгляните на пользовательскую кнопку Facebook Share JSFIDDLE

Включить код JavaScript JavaScript JavaScript сразу после открытия тега <body>

<div id="fb-root"></div>
<script>(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/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

И разместите ниже код, где бы вы ни хотели показывать кнопку Facebook Share

<div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-width="200" data-type="button_count"></div>

enter image description here

Проверьте работу JSFIDDLE

Ответ 4

Поделиться диалоговым окном, не требуя входа в Facebook

Вы можете запустить диалог совместного доступа, используя функцию FB.ui с параметром метода share, чтобы поделиться ссылкой. Этот диалог доступен в SDK для Facebook для JavaScript, iOS и Android, выполнив полную переадресацию на URL.

Вы можете вызвать этот вызов:

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/', // Link to share
}, function(response){});

Вы также можете включить метатеги open graph на странице по этому URL-адресу, чтобы настроить историю, которая была передана на Facebook.

Обратите внимание, что response.error_message появится только в том случае, если кто-то, использующее ваше приложение, аутентифицировал ваше приложение с помощью входа в Facebook.

Также вы можете напрямую обмениваться ссылкой с вызовом, имея Javascript Facebook SDK.

https://www.facebook.com/dialog/share&app_id=145634995501895&display=popup&href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2F&redirect_uri=https%3A%2F%2Fdevelopers.facebook.com%2Ftools%2Fexplorer

https://www.facebook.com/dialog/share&app_id={APP_ID}&display=popup&href={LINK_TO_SHARE}&redirect_uri={REDIRECT_AFTER_SHARE}

  • app_id = > Уникальный идентификатор вашего приложения. (Обязательно.)

  • redirect_uri = > URL-адрес для перенаправления после того, как человек нажимает кнопку в диалоговом окне. Требуется при перенаправлении URL.

  • display = > Определяет способ отображения диалога.

Если вы используете реализацию диалога переадресации URL-адресов, то это будет полный просмотр страницы, показанный на Facebook.com. Этот тип отображения называется страницей. Если вы используете один из наших iOS или Android SDK для вызова этого диалогового окна, это автоматически указывается и выбирает соответствующий тип отображения для устройства. Если вы используете SDK для JavaScript для JavaScript, по умолчанию будет использоваться модальный тип iframe для людей, которые вошли в ваше приложение или асинхронно, используя в игре на Facebook.com, и всплывающее окно для всех остальных. При необходимости вы можете использовать всплывающие окна или типы страниц при использовании SDK для JavaScript для JavaScript. Мобильные веб-приложения всегда будут по умолчанию использовать тип сенсорного дисплея. share Параметры

  • href= > Ссылка, прикрепленная к этому сообщению. Требуется при использовании совместного использования метода. Включите открытые метатеги на странице на этом URL-адресе, чтобы настроить общий рассказ.

Ответ 5

Для вашего собственного конкретного сервера или разных страниц и кнопки изображения вы можете использовать что-то вроде этого (только для PHP)

<a href="http://www.facebook.com/sharer/sharer.php?u=http://'.$_SERVER['SERVER_NAME'].'" target="_blank"><img src="http://i.stack.imgur.com/rffGp.png" /></a>

Я не могу поделиться с этим фрагментом, но вы получите идею...

Ответ 6

Для Facebook share с изображением без API и с помощью # для глубокой ссылки на подстраницу, трюк состоял в том, чтобы поделиться изображением как picture=

Переменной mainUrl будет http://yoururl.com/ 

var d1 = $('.targ .t1').text();
var d2 = $('.targ .t2').text();
var d3 = $('.targ .t3').text();
var d4 = $('.targ .t4').text();
var descript_ = d1 + ' ' + d2 + ' ' + d3 + ' ' + d4;
var descript = encodeURIComponent(descript_);

var imgUrl_ = 'path/to/mypic_'+id+'.jpg';
var imgUrl = mainUrl + encodeURIComponent(imgUrl_);

var shareLink = mainUrl + encodeURIComponent('mypage.html#' + id);

var fbShareLink = shareLink + '&picture=' + imgUrl + '&description=' + descript;
var twShareLink = 'text=' + descript + '&url=' + shareLink;

// facebook
$(".my-btn .facebook").off("tap click").on("tap click",function(){
  var fbpopup = window.open("https://www.facebook.com/sharer/sharer.php?u=" + fbShareLink, "pop", "width=600, height=400, scrollbars=no");
  return false;
});

// twitter
$(".my-btn .twitter").off("tap click").on("tap click",function(){
  var twpopup = window.open("http://twitter.com/intent/tweet?" + twShareLink , "pop", "width=600, height=400, scrollbars=no");
  return false;
});