如何在Facebook上实现分享时将特定图像显示为缩略图？

Question

我正在尝试实现共享此方法.我使用的代码如下

http://www.facebook.com/share.php?u=my_website_url

现在Facebook正在显示它在左侧显示一些缩略图.这些图片是从我的网站上挑选的.如何选择特定图像作为缩略图或至少停止显示缩略图？

你可以用我的博客地址查看.

Answer 1

从Facebook的规范,使用这样的代码:

<meta property="og:image" content="http://siim.lepisk.com/wp-content/uploads/2011/01/siim-blog-fb.png" />

来源:Facebook分享

Answer 2

这篇博文似乎有你的答案:http: //blog.capstrat.com/articles/facebook-share-thumbnail-image/

具体来说,使用如下标记:

<link rel="image_src" 
      type="image/jpeg" 
      href="http://www.domain.com/path/icon-facebook.gif" />

图像的名称必须与示例中的名称相同.

点击"确保预览正常"

注意:标签可以是正确的,但根据他们的文档,Facebook每24小时只会刮擦一次.使用Facebook Lint页面将图像导入Facebook.

http://developers.facebook.com/tools/lint/

Answer 3

根据他们的文档,我的标签是正确的,但Facebook每24小时只会刮擦一次.使用Facebook Lint页面将图像放入Facebook.

在此输入您的URL,FB将更新您页面中的元数据:

https://developers.facebook.com/tools/debug(更新链接)

Answer 4

Facebook使用og:tags和开放式图形协议来解析在共享对话框 或Facebook上的新闻源中预览URL时要显示的信息.

将og:tags包含如下信息:

• 页面标题
• 页面类型
• 网址
• 网站名称
• 页面的描述
• Facebook user_id的页面管理员(在Facebook上)

这是一些例子(取自facebook文档)og:tags

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

一旦您实现了正确的标记og:tags并设置了它们的值,您就可以使用Facebook调试器测试Facebook如何查看您的URL .调试器工具还将突出显示它og:tags在页面上找到的任何问题或缺少的问题.

要记住的一件事是facebook 确实对这些信息进行了一些缓存,因此为了使更改生效,您的页面将被删除,如文档中所述:

编辑元标记

您可以通过更新页面标签来更新页面的属性.请注意,og:title和og:type最初只能编辑 - 在您的页面收到50之后,标题变得固定,并且在您的页面收到10,000个喜欢后,类型将变为固定.这些属性是固定的,以避免已经喜欢该页面的令人惊讶的用户.达到这些限制后更改标题或类型标签不起作用,您的页面保留原始标题和类型.

要在Facebook上反映更改,您必须强制删除页面.当页面管理员单击"赞"按钮或将URL输入Facebook URL Linter Facebook Debugger时,页面将被删除 ...

Answer 5

我看到提供的所有答案都是正确的.然而,忽略了一个重要的细节:图像的大小必须至少为200 X 200像素,否则Facebook将用缩略图替换第一个符合页面标准的可用图像.另一个事实是,所需的最低要求是包括Facebook对og:image生效所需的3个元素:

<meta property="og:title" content="Title of the page" />
<!-- NEXT LINE Even if page is dynamically generated and URL contains query parameters -->
<meta property="og:url" content="http://yoursite.com" />
<meta property="og:image" content="http://convertaholics.com/convertaholics-og.png" />

使用Facebook调试器调试您的页面并修复所有警告,它应该像魅力一样工作! https://developers.facebook.com/tools/debug