如何自定义Facebook的sharer.php


Answers:


79

您所说的是共享链接时Facebook提取的预览图像和文本。Facebook使用开放图谱协议获取此数据。

本质上,您要做的就是将这些og:meta标签放在您要共享的网址上-

<meta property="og:title" content="The Rock"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
<meta property="og:site_name" content="IMDb"/>
<meta property="fb:admins" content="USER_ID"/>
<meta property="og:description"
      content="A group of U.S. Marines, under command of
               a renegade general, take over Alcatraz and
               threaten San Francisco Bay with biological
               weapons."/>

如您所见,既有图像属性又有描述。当您更改页面og:meta标签时,您可以使用Facebook Debugger测试这些更改。它会告诉您是否犯了任何错误(以及如何纠正错误!)


8
我不认为这是答案...因为这些标记被硬编码到html中,因此迫使整个页面上的任何/所有fb按钮服从这些值...也许我在一页上有3个fb共享按钮,我希望每个人都有一个自定义的图片/说明。...没错,您可以在执行共享操作之前使用js更改元值,但这似乎并不实际,并且动态更改元标记似乎是一种不好的做法(因为这不是目的)。...我将改用Lee Sibbald sharer.php解决方案。
dsdsdsdsd

1
话虽这么说,但我确实在每个页面上都使用了这些meta标签,以防万一用户将页面的url复制/粘贴到fb帖子中,那么这些metas就可以了...但不是针对单个fb按钮(“分享这幅画”或“分享这玩笑”)
dsdsdsdsd

3
关于动态OG标签生成-我已经使用PHP进行了多次,从而根据QueryString参数动态填充OG标签。只要每个按钮的参数在某种程度上都是唯一的,它就起作用(例如,在每个Button URL的末尾添加“?id = 123”,并将“ 123”更改为唯一)。与Facebook上的人进行讨论后,这并未被标记为不良做法,因此,我认为以这种方式工作是完全可以的。但是请注意,由于FB刮板没有JS引擎,因此JS不能用于此目的。
Snouto

2
@dsdsdsdsd-即使您要共享一个巨大的内容页面,每个内容都需要自己的永久链接,对吗?/ That /是放置自定义OG标签的位置。
Trass Vasston

经过所有讨论,您如何解决Facebook缓存我们网站的问题。我已经搜索了2天以上。链接生成正确,但是缩略图和文本不是来自帖子而是来自我网站上一篇帖子的缓存数据。有人可以对此发表评论。谢谢

58

更新:

这个答案已经过时了。

就像@ jack-marchetti在他的评论中所述,以及@devantoine带有链接:https : //developers.facebook.com/x/bugs/357750474364812/

由于易卜拉欣·福尔(Ibrahim Faour)答复了与Facebook一起提交的错误,Facebook改变了sharer.php的工作方式。

共享者将不再接受自定义参数,facebook将从url OG元标记中提取在预览中显示的信息,就像在帖子中在Facebook上显示的信息一样。


试试看(通过本例中的Javascript):

'http://www.facebook.com/sharer.php?s=100&p[title]='+encodeURIComponent('this is a title') + '&p[summary]=' + encodeURIComponent('description here') + '&p[url]=' + encodeURIComponent('http://www.nufc.com') + '&p[images][0]=' + encodeURIComponent('http://www.somedomain.com/image.jpg')

我很快尝试了此操作,没有图像部分,并且sharer.php窗口似乎已预先填充,因此它看起来像一个解决方案。

我通过这篇SO文章找到了这个:

想要Facebook中的自定义标题/图片/描述来自Flash应用程序的共享链接

这个链接包含在Lelis718的答案中:

http://www.daddydesign.com/wordpress/how-to-create-a-custom-facebook-share-button-for-your-iframe-tab/

因此,所有人都将这个答案归功于Lelis718。

[2013年5月3日编辑]-似乎我在此处使用的原始网址不再对我有用,而在查询字符串中也未包含“ s = 100”-不知道为什么,但已经进行了相应更新


1
嘿@ lee-sibbald好像Facebook改变了它,我再也无法在该对话框中显示图像了。有趣的……
朱利安·H·林

1
@ JulianH.Lam您是否注意到我几天前添加的编辑?我正在使用上面显示的包括“ s = 100”的链接,它似乎工作正常
Snouto

嗨,@ LeeSibbald,我确实做到了,但仍然无法正常工作。最后,我使用了较新的“ Feed Dialog”窗口来重做对话框,这也不是很完美。不管怎么说,还是要谢谢你!
朱利安·林

4
p [x]参数似乎不再起作用,至少在您有问题的页面上有有效的opengraph标签的情况下。
Mike Shultz

2
共享者不再接受自定义参数:developers.facebook.com/x/bugs/357750474364812
DevAntoine 2015年

22

似乎以下答案不再有效,并且Facebook不再在“提要对话框”链接上接受参数

您可以通过URL使用“馈送对话框”来模拟Sharer.php的行为,但是要复杂一些。您需要一个Facebook App设置,并配置您打算共享的URL的基本URL。然后,您可以执行以下操作:

1)创建一个链接,例如:

   http://www.facebook.com/dialog/feed?app_id=[FACEBOOK_APP_ID]' +
        '&link=[FULLY_QUALIFIED_LINK_TO_SHARE_CONTENT]' +
        '&picture=[LINK_TO_IMAGE]' +
        '&name=' + encodeURIComponent('[CONTENT_TITLE]') +
        '&caption=' + encodeURIComponent('[CONTENT_CAPTION]) +
        '&description=' + encodeURIComponent('[CONTENT_DESCRIPTION]') +
        '&redirect_uri=' + FBVars.baseURL + '[URL_TO_REDIRECT_TO_AFTER_SHARE]' +
        '&display=popup';

(用适当的内容替换[CONTENT]。这里的文档:https : //developers.facebook.com/docs/reference/dialogs/feed

2)点击共享链接,在弹出窗口中使用JavaScript打开该链接

3)我喜欢创建文件(即popupclose.html)以将用户重定向回共享完成后的位置,该文​​件将包含<script>window.close();</script>以关闭弹出窗口

使用Feed对话框(设置除外)的唯一缺点是,如果您还管理Pages,则无法选择通过Page进行共享,只有普通用户帐户才能共享。它可以为您提供一些真正的含糊不清的错误消息,其中大多数与您的Facebook应用程序的设置或共享的内容或URL有关。


2
金!在尝试了令人难以置信的不可靠且容易出现连接错误的JSDK版本之后,它变得更加可靠和稳定。非常感谢!
Rid Iculous

1
自定义参数的对话框供稿支持今天(2017
到期

尽管链接有效,但@LocalPCGuy参数不起作用,但是图像描述和标题不起作用,请引导我
Sanaullah

/ u / Sanaullah不再起作用,Faceboook删除了此功能。请参阅答案顶部的粗体注释。
LocalPCGuy

15

Sharer.php不再允许您自定义。您共享的页面将被抓取以获取OG标签,并且该数据将被共享。

要正确自定义,请使用FB.UIJS-SDK随附的工具。


或通过“共享”对话框,它可以像sharer.php一样只是一个链接(尽管这些链接将链接到Facebook应用程序,这可能不是更可取的)
fregante 2014年

5

用于分享帖子的Facebook sharer.php参数。

<a href="javascript: void(0);"
   data-layout="button"
   onclick="window.open('https://www.facebook.com/sharer.php?u=MyPageUrl&summary=MySummary&title=MyTitle&description=MyDescription&picture=MyYmageUrl', 'ventanacompartir', 'toolbar=0, status=0, width=650, height=450');"> Share </a>

不要使用空格,请使用&nbsp

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.