Facebook分享按钮:如何实现

9
我正在尝试像这里实现分享按钮。我想让用户在不需要任何应用程序权限的情况下将给定链接发布到他们的新闻供稿中,并提供一些可选的文本。BuzzFeed是如何做到的?Facebook的文档对我来说非常混乱,这就是为什么我很难自己实现它。如果有人能够列出所需的步骤,那就太好了。我需要在我的HTML页面中放置什么?我需要创建一个Facebook应用程序吗?
4个回答

8
要分享您的网页,您不需要创建Facebook应用程序。
您只需放置那个Facebook分享图像,并使用href = "http://www.facebook.com/sharer.php?u=<your url>" Facebook的“喜欢”按钮也允许分享。 生成该按钮的代码在官方文档中。

是的,我看过了,但我有点困惑,因为我正在寻找分享按钮,而不是喜欢按钮 :) 顺便问一下,那真的是我所需要的全部吗?JS呢?如果我不需要在网页中添加任何Facebook JS,那么fb弹出窗口是如何出现的? - paul smith
请查看 http://jsfiddle.net/ER4Zy/。只有HTML,没有Javascript。但是您可以使用“喜欢”按钮。它既可以作为喜欢按钮,也可以作为分享按钮。 - Anirudh Ramanathan
我明白了。有没有办法指定在帖子中显示的图片以及链接的文本描述? - paul smith
如果你想的话,你可以使用那张图片作为链接。但是最好还是使用Facebook文档中的新like按钮。所有新网站都推荐使用它。 - Anirudh Ramanathan

5

编辑您想要共享的页面,在头部添加以下内容到元标签中。

<meta property="og:image" content="http://www. XXXX url of a jpg image you want to be displayed  on shared content has to be 200x200 pixels (make it in photoshop ect.) XXXX"/>
<meta property="og:title" content="xxxx A title you want to be dispayed in shared content xxxx"/>
<meta property="og:url" content="http://www. url of the page you want shared including the slash after .com xxx .com/"/>
<meta property="og:description" content="xxxx discription of the shared content xxx "/>

除了这些以外,这里还有一份og属性列表-http://ogp.me/

接下来,在你希望分享按钮出现的位置插入以下内容:

<a title="xxx Share mypage.com xxx" href="http://www.facebook.com/sharer.php? u=http://www. xxx url of page you edited above xxx .com &t=xxx a title you want to use xxx" target="_blank"><img  src="http://www. xxx an image for the share button (make it in photoshop ect.)xxx" width="xx" height="xx" alt="Share"/></a>

显然需要删除 xxx 并保留引号,如果在测试过程中更改了上述任何内容,则可能需要前往 Facebook 调试器并调试它,因为它有时会保留原始内容。
希望这有所帮助。

2

如果你想自定义分享页面,请尝试以下方法:

Javascript弹窗示例:

var title = 'My Title';
var summary = 'This is my summary';
var url = 'http://www.mydomain.com/path/to/page';
var image = 'http://www.mydomain.com/images/myimage.png';

var fb = window.open('http://www.facebook.com/sharer.php?s=100&p[title]='+encodeURIComponent(title)+'&p[url]='+encodeURIComponent(url)+'&p[summary]='+encodeURIComponent(summary)+'&p[images][0]='+encodeURIComponent(image));
fb.focus();

1
这是可以运行的代码。
在HTML中:
<a href="http://www.facebook.com/sharer.php?u=<http://google.com">Facebook Link</a>

请将 http://google.com 替换为您的URL。

在PHP中,如果您想要获取当前所在的URL:

<a href="http://www.facebook.com/sharer.php?u=<<?php echo "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"; ?>">Facebook</a>

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接