分享我的 URL 时,Facebook Sharer 如何选择图像和其他元数据? [英] How does Facebook Sharer select Images and other metadata when sharing my URL?

查看:31
本文介绍了分享我的 URL 时,Facebook Sharer 如何选择图像和其他元数据?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在使用 Facebook Sharer 时,Facebook 将向用户提供使用从源中提取的少数图像之一作为其链接预览的选项.这些图像是如何选择的,我如何确保我页面上的任何特定图像总是包含在此列表中?

解决方案

当我的页面被分享时,我如何告诉 Facebook 使用哪个图像?

Facebook 有一组 ,它们于 2010 年 6 月推出,用于刷新缓存并解决页面上的任何元标记问题.

此外,页面上的图像必须可供 Facebook 抓取工具公开访问.您应该指定绝对 url,例如 http://example.com/yourimage.jpg 而不仅仅是/yourimage.jpg.jpg

我可以使用客户端代码(如 Javascript 或 jQuery)更新这些元标记吗?不.与搜索引擎爬虫非常相似,Facebook 抓取工具不执行脚本,因此下载页面时出现的任何元标记都是用于图像选择的元标记.

添加这些标签会导致我的页面不再验证.我该如何解决这个问题?

您可以将必要的 Facebook 命名空间添加到您的标签中,然后您的页面应通过验证:

<html xmlns="http://www.w3.org/1999/xhtml"xmlns:og="http://ogp.me/ns#"xmlns:fb="https://www.facebook.com/2008/fbml">

When using Facebook Sharer, Facebook will offer the user the option of using 1 of a few images pulled from the source as a preview for their link. How are these images selected, and how can I ensure that any particular image on my page is always included in this list?

解决方案

How do I tell Facebook which image to use when my page gets shared?

Facebook has a set of open-graph meta tags that it looks at to decide which image to show.

The keys one for the Facebook image are:

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

and it should be present inside the <head></head> tag at the top of your page.

If these tags are not present, it will look for their older method of specifying an image: <link rel="image_src" href="/myimage.jpg"/>. If neither are present, Facebook will look at the content of your page and choose images from your page that meet its share image criteria: Image must be at least 200px by 200px, have a maximum aspect ratio of 3:1, and in PNG, JPEG or GIF format.

Can I specify multiple images to allow the user to select an image?

Yes, you just need to add multiple image meta tags in the order you want them to appear in. The user will then be presented with an image selector dialog:

I specified the appropriate image meta tags. Why isn't Facebook accepting the changes?

Once a url has been shared, Facebook's crawler, which has a user agent of facebookexternalhit/1.1 (+https://www.facebook.com/externalhit_uatext.php), will access your page and cache the meta information. To force Facebook servers to clear the cache, use the Facebook Url Debugger / Linter Tool that they launched in June 2010 to refresh the cache and troubleshoot any meta tag issues on your page.

Also, the images on the page must be publicly accessible to the Facebook crawler. You should specify absolute url's like http://example.com/yourimage.jpg instead of just /yourimage.jpg.

Can I update these meta tags with client side code like Javascript or jQuery? No. Much like search engine crawlers, the Facebook scraper does not execute scripts so whatever meta tags are present when the page is downloaded are the meta tags that are used for image selection.

Adding these tags causes my page to no longer validate. How can I fix this?

You can add the necessary Facebook namespaces to your tag and your page should then pass validation:

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:og="http://ogp.me/ns#"
      xmlns:fb="https://www.facebook.com/2008/fbml">  

这篇关于分享我的 URL 时,Facebook Sharer 如何选择图像和其他元数据?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆