当使用Facebook Sharer时,Facebook将为用户提供使用从源中提取的几个图像中的一个作为他们的链接预览的选项。如何选择这些图像,以及如何确保页面上的任何特定图像始终包含在此列表中?
当前回答
当你在Facebook上分享时,你必须在标题部分添加你的html下一个元标签:
<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />
就是这样!
添加按钮,因为你应该根据FB告诉你。
你需要的所有信息都在www.facebook.com/share/
其他回答
当我的页面被分享时,我如何告诉Facebook使用哪张图片?
Facebook有一组开放图元标签,它通过查看这些标签来决定展示哪张图片。
Facebook图片的关键是:
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
<meta property="og:image:secure_url" content="https://secure.example.com/ogp.jpg" />
它应该出现在页面顶部的<head></head>标签内。
如果这些标记不存在,它将查找它们指定图像的旧方法:<link rel="image_src" href="/myimage.jpg"/>。如果两者都不存在,Facebook将查看您的页面内容,并从您的页面中选择符合其共享图像标准的图像:图像必须至少200px * 200px,最大纵横比为3:1,格式为PNG、JPEG或GIF。
我可以指定多个图像以允许用户选择一个图像吗?
是的,你只需要按你想要它们出现的顺序添加多个图像元标记。然后用户将看到一个图像选择器对话框:
我指定了适当的图像元标记。为什么Facebook不接受这些改变?
一旦一个url被共享,Facebook的爬虫(它有facebookexternalhit/1.1 (+https://www.facebook.com/externalhit_uatext.php)的用户代理)将访问你的页面并缓存元信息。要强制Facebook服务器清除缓存,请使用Facebook Url调试器/ Linter工具,该工具于2010年6月推出,用于刷新缓存并解决页面上的任何元标签问题。
此外,页面上的图像必须对Facebook爬虫公开访问。你应该指定绝对的url,比如http://example.com/yourimage.jpg,而不是/yourimage.jpg。
我可以用Javascript或jQuery等客户端代码更新这些元标签吗? 不。就像搜索引擎爬虫一样,Facebook scraper不执行脚本,所以当页面被下载时,无论出现什么元标签,都是用于图像选择的元标签。
添加这些标记会导致我的页面不再有效。我该如何解决这个问题?
你可以添加必要的Facebook名称空间到你的标签,然后你的页面应该通过验证:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">
我无法让Facebook从特定的帖子中选择正确的图像,所以我做了这个页面上概述的事情:
https://webapps.stackexchange.com/questions/18468/adding-meta-tags-to-individual-blogger-posts
换句话说,是这样的:
<b:if cond='data:blog.url == "http://urlofyourpost.com"'>
<meta content='http://urlofyourimage.png' property='og:image'/>
</b:if>
基本上,你要硬编码一个if语句到你的网站的HTML中,让它改变元内容,不管你为那篇文章改变了什么。这是一个混乱的解决方案,但它有效。
我有这个问题,并解决了它与手册84的建议。使用400x400px的图像效果很好,而我的小图像从未出现在共享器中。
请注意,Facebook推荐最小200px的正方形图像作为og:image标签:https://developers.facebook.com/docs/opengraph/howtos/maximizing-distribution-media-content/#tags
当你在Facebook上分享时,你必须在标题部分添加你的html下一个元标签:
<meta property="og:title" content="title" />
<meta property="og:description" content="description" />
<meta property="og:image" content="thumbnail_image" />
就是这样!
添加按钮,因为你应该根据FB告诉你。
你需要的所有信息都在www.facebook.com/share/
旧方法,不再有效:
<link rel="image_src" href="http://yoururl/yourimage"/>
报告新方法,也不奏效:
<meta property="og:image" content="http://yoururl/yourimage"/>
在我执行它的第一天,它随机地断断续续地工作,从那以后就再也没有工作过。
Facebook linter页面,一个检查你的页面的实用工具,报告一切都是正确的,并显示我选择的缩略图…只是share.php页面本身似乎不能正常工作。肯定是Facebook的一个bug,他们显然不愿意修复,因为我在他们的系统中看到的关于这个问题的每个bug报告都说已经解决或修复了。
推荐文章
- 使用什么api来绘制其他应用程序(如Facebook的Chat Heads)?
- Android Facebook集成无效键散列
- 如何创建Android Facebook密钥哈希?
- Android-Facebook应用程序的键散列
- 如何找到并运行keytool
- Facebook API -如何通过Facebook API获得Facebook用户的个人资料图像(不需要用户“允许”应用程序)
- 如何从事件对象访问自定义属性在反应?
- Android Facebook风格幻灯片
- 为WhatsApp链接共享提供一个图像
- Facebook OAuth“这个URL的域名不包括在应用程序的域名中”
- FB OpenGraph og:图像不拉图像(可能是https?)
- Facebook Graph API v2.0+ - /me/friends返回空,或者只有朋友也使用我的应用程序
- 当分享我的URL时,Facebook分享者如何选择图像和其他元数据?
- 在iOS应用程序中设计Facebook身份验证,同时访问安全的web服务
- Facebook回调附加“#_=_”到返回URL