Facebook的post链接图片

当某人在Facebook上发布链接时,脚本通常会扫描该链接以显示任何图像,并在post旁边显示一个快速缩略图。 对于某些url,虽然(包括我的),FB似乎没有拿起任何东西,尽pipe他们是在该网页上的一些图像。

我读到FB优先select用户希望指定图像的“image_src”rel标签,但是这不会为我的网站生成该缩略图。

我的url直接进入DNS,而不是转发,所以我不认为这可能是问题。

有没有人有一个想法,为什么FB不能从我的网站生成任何缩略图?

最简单的方法就是链接标签:

<link rel="image_src" href="http://stackoverflow.comhttp://img.dovov.comlogo.gif" /> 

但是,还有一些其他的东西可以添加到您的网站,使其更加友好:

打开graphics标签

Open Graph标签是您添加到网站的<head>标签,用于描述您的网页所代表的实体,无论是乐队,餐厅,博客还是其他内容。

Open Graph标签看起来像这样:

 <meta property="og:tag name" content="tag value"/> 

如果您使用Open Graph标签,则需要以下六个标签:

  • og:title – 实体的标题。
  • og:type – 实体的types。 您必须从Open Graphtypes的列表中select一个types。
  • og:image – 表示实体的图像的URL。 图像必须至less为50像素×50像素。 方形图像效果最好,但是您可以使用高达三倍的图像。
  • og:url – 表示实体的页面的规范永久URL。 当您使用Open Graph标签时,Likebutton将链接发送到og:url而不是Likebutton代码中的URL。
  • og:site_name – 您网站的可读名称,例如“IMDb”。
  • fb:adminsfb:app_id – 页面pipe理员的Facebook ID或Facebook Platform应用程序ID的逗号分隔列表。 至less,只包含您自己的Facebook ID。

有关Open Graph标签的更多信息以及pipe理页面的详细信息,请参阅Open Graph协议文档。

http://developers.facebook.com/docs/reference/plugins/like

我知道这个问题已经很老了,但是我最近处理的是同样的问题,几个星期之后就一直围绕在这个问题上。 Google上的多次search发现了很多有用的信息,但其中大部分都集中在了Open Graph标签上,而这些标签我并不感兴趣。 事实certificate,我的网站有多个问题,但这里有一些基础知识。

  1. 正如EightyEight所说的,确保你的HTML是有效的 – 同样适用于你的JavaScript和服务器端代码(PHP,ASP等)。 我在一段代码中出现了一个小的PHP错误,这个错误是作为从主页面单独调用服务器来执行的。 由于一些奇怪的巧合,该代码产生了500错误 – 但只适用于IE6和严格的parsing引擎,如W3Cvalidation器和Facebook页面爬行器。 这个问题在现代浏览器(Chrome 4,FF 3.5,IE 8等)中没有出现,所以我没有马上看到它,但是老一点/更严格的客户端每次都显示500,这就是FB没有的主要原因抓取我们的页面(当其他一切似乎是正确的时候)。

  2. 关于Randy的回应,他更正了Facebook的旧版caching副本。 FB声称这只是24小时,但我经历了比这更长的时间。 FORTUNATELY,FB已经发布了他们的“URL Linter”工具,它会告诉你在FB上共享页面的过程, 强制FB立即更新页面caching。 这是一个救生工具。 你可以在http://developers.facebook.com/tools/lint/find它;

  3. 关于URL Linter工具,请注意,URL的每个变体都在Facebook上单独caching,因此“www.example.com”与“example.com”不同。 此外,还会存储唯一的大写字母 ,因此“ExampleOne.com”与“exampleone.com”不一样。 (这导致我的客户和我自己之间的很多混淆,当我觉得caching已经被更新的很好,客户声称他们没有看到更新。原来我在看exampleone.com,并用Linter更新了caching,但是他们正在查看我还没有提交给Linter的exampleOne.com,因此,我最终提交了Linter的一些变体,以便覆盖基础。)

  4. WyrdNEXUS的使用image_src链接标签的build议是点亮的。 这可以让你确定FB正在为你的页面挖掘最好的图像。 有一些不同的指导方针,那里有什么规格的图像文件应该有,但我已经成功地使用了一个128像素的正方形图像,并看到一个130×97图像通过以及。 这里是来自http://developers.facebook.com/docs/reference/plugins/like/的; Facebook官方文档:

    图像必须至less为50像素×50像素。 方形图像效果最好,但是您可以使用高达三倍的图像。

    显然,FB会为你调整一个大的图像,但是如果你事先调整好自己的大小,你几乎总能得到更好的效果。

  5. 关于Mike Cooper与eHow文章的链接,请避免使用该文章中的第1步。 这篇文章写的是有效的build议,当Mike发布了这个链接的时候,现在最好使用URL Linter工具预览你的页面在共享时的显示方式。 通过使用Linter,你不会让FBcaching页面的(可能)坏的副本,然后你有机会调整它。

要更改标题,描述和图像,我们需要在头标签下添加一些元标签。

第1步:在头标下添加元标记

 <html> <head> <meta property="og:url" content="http://www.test.com/" /> <meta property="og:image" content="http://www.test.com/img/fb-logo.png" /> <meta property="og:title" content="Prepaid Phone Cards, low rates for International calls with Lucky Prepay" /> <meta property="og:description" content="Cheap prepaid Phone Cards. Low rates for international calls anywhere in the world." /> 

下一步:点击下面的链接https://developers.facebook.com/tools/debug

在您提到标签的文本框中添加您的url(例如http://www.test.com/ )。 点击DEBUGbutton。

完成。

你可以在这里validationhttps://www.facebook.com/sharer/sharer.php?u=http://www.test.com/

在上面的url中,你=你的网站链接

请享用 !!!!

使用这里提供的facebook lintter。 http://developers.facebook.com/tools/lint/

这将检查您的链接,并重新获取任何图像。 这也清除任何旧的caching。

或者试试这个 – https://developers.facebook.com/tools/debug

试试这个: http : //www.ehow.com/how_4938148_thumbnail-show-up-facebook-share.html

该网站的HTML是否有效? 通过w3cvalidation服务运行它。

实际上,如果您已经尝试在Facebook上添加“image_src”链接之前链接该页面,Facebook将继续使用旧的caching副本,甚至不会看到您的更改。 尝试通过删除或添加“www”来修改url,或者复制您的网页以对其进行testing。

我注意到,如果Facebook以https开头,那么Facebook不会从网站获取缩略图,可能是您的情况?

有同样的问题,并认为我的头闭标签是在错误的地方

老问题,但最近我似乎遇到了同样的问题,从我的链接的缩略图图像没有显示在Facebook的状态更新。 我发布了很多客户,这是相对较新的。

FB似乎不再喜欢长URL – 如果你使用一个URL缩写,如goo.gl或bitly.com,链接/文章的缩略图将出现在你的FB更新。

尝试使用这样的东西:

 <link rel="image_src" href="http://yoursite.com/graphics/yourimage.jpg" /link>` 

似乎在Firefox上工作得很好,只要你使用完整的path到你的图像。

麻烦是由于某种原因垂直向下偏移。 图片是我读的地方推荐的200 x 200。

如果您使用任何插件的SEO,然后检查您的SEO插件设置。然后找出Noindex设置如果启用媒体Noindex然后禁用它。