Facebook - 更改缩略图

时间:2012-08-29 16:30:31

标签: html facebook image facebook-like thumbnails

我需要像缩略图一样更改Facebook,我试过这个

<link rel="image_src" href="thisurl" />

和这个

<meta property="og:image" content="thisurl"/>

之后我意识到这需要进入头脑,但由于代码的结构我无法在那里修改并仍然决定我需要哪个url(我无法访问我拥有的变量)那里的图像),我可以像这样修改

<html>
<head></head>
<body>
...
modify in here
...
</body>
</html>

我还尝试在我可以更改的区域中使用javascript创建元标记,但不会影响它

有没有人知道我可以告诉facebook我想要哪个图像作为缩略图,而无需修改头部元素内部

1 个答案:

答案 0 :(得分:2)

缩略图应该像你所说的那样使用rel =“image_src”或opengraph标签进入标题。

在html正文中指定缩略图

如果Facebook无法从标题中获取缩略图,则会尝试从内容中获取缩略图。它通常采用它喜欢的第一个图像,因此如果你想强制不包含在页面中的特定缩略图,请在标记之后放置一个不可见的图像(使用内联css display:none ):

<img src=”http://www.website.com/images/thumbnail.jpg” alt=”thumbnail” height=”200″ width=”250″ style=”display:none” />

这样做,请记住:

  • 避免缩略图名称中的空格(FB不能很好地管理空格)
  • 使用jpg(FB不喜欢png)
  • 使用正确的尺寸(见下文)

检查缩略图的尺寸

Facebook不喜欢各种尺寸的缩略图。最重要的是高度和宽度之间的比率应小于1/3。所以40&amp; 100可以,但30&amp; 100将无法正常工作。此外,Facebook最近似乎更喜欢两个维度至少200px的图像(但不要忘记1/3规则)。

清理Facebook缓存

此外,您应该在每次测试之前使用Facebook调试工具(曾经知道为 Facebook Linter )清理Facebook缓存: http://developers.facebook.com/tools/debug

在表单字段中插入您的网址,然后按“调试”。您将强制Facebook覆盖其有关您链接的信息。有时您认为仍然存在问题,但这仅仅是因为它使用了错误的页面缓存版本。

关于Facebook Linter,请注意(相应于他的OGraph文档):

  

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