110

我有这个代码,假设可以工作,但不工作。如果无论如何这对您有帮助,那就太好了。

<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 分享按钮,这应该只是将我网站的内容发布在墙上。谁想分享。

我研究了很多,但没有得到任何东西。请帮助我。

提前致谢。

4

7 回答 7

306

你不需要所有的代码。您只需要以下几行:

<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/找到文档

于 2013-05-09T15:04:20.793 回答
27

您可以使用 facebook 提供的异步 Javascript SDK 来做到这一点

看看下面的代码

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>

注意:请记住用您的 facebook AppId 替换您的 APP ID。如果您没有 facebook AppId 并且您不知道如何创建,请检查此

添加 JQuery 库,我更喜欢谷歌库

<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">

有关更详细的信息。请点击这里

于 2014-05-23T06:35:46.813 回答
14

您可以在 Facebook 开发者网站上阅读更多关于分享按钮的信息

工作JSFIDDLE

另请查看自定义 Facebook 分享按钮JSFIDDLE

<body>在开始标记之后包含 Facebook JavaScript SDK 代码

<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 分享按钮的任何地方

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

在此处输入图像描述

检查工作的 JSFIDDLE

于 2014-04-21T05:58:46.770 回答
6

对于 Facebook与没有API的图像共享并使用深度链接到子页面,诀窍是将图像共享为 变量将是#picture=

mainUrlhttp://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;
});
于 2016-10-19T22:24:39.660 回答
2

无需登录 Facebook 即可共享对话框

您可以使用带有 share 方法参数的 FB.ui 函数触发共享对话框来共享链接。通过执行完全重定向到 URL,此对话框在适用于 JavaScript、iOS 和 Android 的 Facebook SDK 中可用。

您可以触发此调用:

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

您还可以在此 URL 的页面上包含打开的图元标记,以自定义分享回 Facebook 的故事。

请注意,仅当使用您的应用程序的人使用 Facebook 登录对您的应用程序进行了身份验证时,才会出现 response.error_message。

您也可以通过 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 之一来调用对话框,则会自动指定并为设备选择合适的显示类型。如果您使用 Facebook SDK for JavaScript,这将默认为登录到您的应用程序的人使用的模态 iframe 类型或在 Facebook.com 上的游戏中使用时异步,并为其他所有人提供弹出窗口。如有必要,您还可以在使用 Facebook SDK for JavaScript 时强制弹出或页面类型。移动网络应用程序将始终默认为触摸屏类型。共享参数

  • href => 附加到这篇文章的链接。使用方法共享时需要。在此 URL 的页面中包含打开的图形元标记,以自定义共享的故事。
于 2015-12-05T08:34:30.693 回答
1

对于您自己的特定服务器或不同的页面和图像按钮,您可以使用类似这样的东西(仅限 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>

我不能与这个分享片段,但你会明白的......

于 2016-07-08T14:14:35.167 回答
0

这个Facebook 页面有一个简单的工具来创建各种分享按钮。

例如,这是我得到的一些输出:

<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v8.0" nonce="dilSYGI6"></script>
<div class="fb-share-button" data-href="https://www.mocacleveland.org/exhibitions/lee-mingwei-you-are-not-stranger" data-layout="button" data-size="small">
<a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.mocacleveland.org%2Fexhibitions%2Flee-mingwei-you-are-not-stranger&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">Share</a>
</div>
于 2020-09-11T17:03:41.903 回答