Facebook 帖子链接图像

发布于 2024-07-26 12:08:39 字数 262 浏览 6 评论 0原文

当有人在 Facebook 上发布链接时,脚本通常会扫描该链接中的任何图像,并在帖子旁边显示一个快速缩略图。 但对于某些 URL(包括我的 URL),FB 似乎没有获取任何内容,尽管该页面上有许多图像。

我读到 FB 更喜欢用户希望指定的图像的“image_src”rel 标记,但这也不会为我的网站生成该缩略图。

我的 url 直接转到 DNS,并且没有转发,所以我也不认为这可能是问题。

有人知道为什么 FB 无法从我的网站生成任何缩略图吗?

When someone posts a link on facebook, a script usually scans that link for any images, and displays a quick thumbnail next to the post. For certain URLs though (including mine), FB doesn't seem to pick up anything, despite their being a number of images on that page.

I read up that FB prefers the "image_src" rel tag for the image the user wishes to specify, but this does not generate that thumbnail either for my site.

My url goes directly to the DNS, and is not forwarded, so I don't imagine that could be the problem either.

Does anyone have an idea as to why FB can't generate any thumbnails from my site?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(12

裂开嘴轻声笑有多痛 2024-08-02 12:08:40

使用此处提供的 facebook linter。 http://developers.facebook.com/tools/lint/

这将检查您的链接并重新获取任何图像。 这也会清除所有旧的缓存。

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

Use the facebook lintter available here. http://developers.facebook.com/tools/lint/

This will check your link and re fetch any images. this also clears any old cache.

Or try this - https://developers.facebook.com/tools/debug

最单纯的乌龟 2024-08-02 12:08:40

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

步骤1 :
在 head 标签下添加元标签

<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

在文本框中添加您的网址(例如 http://www.test.com/),您在其中提到了标签。 单击“调试”按钮。

完成。

您可以在这里验证 https://www.facebook.com/sharer /sharer.php?u=http://www.test.com/

在上面的网址中,u = 您的网站链接

享受!!!!

To change Title, Description and Image, we need to add some meta tags under head tag.

STEP 1 :
Add meta tags under head tag

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

NEXT STEP :
Click on below link
https://developers.facebook.com/tools/debug

Add your URL in text box (e.g http://www.test.com/) where you mentioned the tags. Click on DEBUG button.

Its done.

You can verify here https://www.facebook.com/sharer/sharer.php?u=http://www.test.com/

In above url, u = your website link

ENJOY !!!!

够钟 2024-08-02 12:08:40

该网站的 HTML 有效吗? 通过w3c 验证服务运行它。

Is the site's HTML valid? Run it through w3c validation service.

夜光 2024-08-02 12:08:40

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

Actually, if you've already tried linking that page on Facebook BEFORE adding the "image_src" link, Facebook will keep using the old cached copy and not even see your changes. Try modifying the URL by removing or adding the 'www', or duplicate your page to test it.

流殇 2024-08-02 12:08:40

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

I've noticed that Facebook does not take thumbnails from websites if they start with https, is that maybe your case?

橘和柠 2024-08-02 12:08:40

遇到了同样的问题,并发现我的头部关闭标签位于错误的位置

had the same problem and figured out that my head closing tag was in the wrong place

寒尘 2024-08-02 12:08:40

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

FB 似乎不再喜欢长 URL — 如果您使用 goo.gl 或 bitly.com 等 URL 缩短器,链接/帖子中的缩略图将出现在 FB 更新中。

Old question but recently I seemed to be running into same issue with thumbnail images from my link not showing in status updates on Facebook. I post for many clients and this is relatively new.

FB doesn't seem to like long URLs anymore — if you use a URL shortener such as goo.gl or bitly.com, the thumbnail from your link/post will appear in your FB update.

我只土不豪 2024-08-02 12:08:40

尝试使用这样的东西:

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

只要您使用图像的完整路径,似乎就可以在 Firefox 上正常工作。

问题是它由于某种原因垂直向下偏移。 图像尺寸为 200 x 200,正如我在某处读到的建议。

Try using something like this:

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

Seems to work just fine on Firefox as long as you use a full path to your image.

Trouble is it get vertically offset downward for some reason. Image is 200 x 200 as recommended somewhere I read.

眸中客 2024-08-02 12:08:40

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

If you used any plugin for seo then Check 1st your seo plugin settings.Then find out Noindex setting if Enable Media for Noindex then disable it.

孤独患者 2024-08-02 12:08:39

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

<link rel="image_src" href="http://stackoverflow.com/images/logo.gif" />

但是您可以添加一些其他内容到您的网站,使其更加社交媒体友好:

开放图谱标签

开放图谱标签是您添加到 <您网站的 code> 来描述您的页面所代表的实体,无论是乐队、餐厅、博客还是其他东西。

开放图谱标签如下所示:

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

如果您使用开放图谱标签,则需要以下六个标签:

  • og:title - 实体的标题。
  • og:type - 实体的类型。 您必须从开放图类型列表中选择一种类型。
  • og:image - 代表实体的图像的 URL。 图像必须至少为 50 像素 x 50 像素。 方形图像效果最好,但您可以使用宽度最多为高度三倍的图像。
  • og:url - 代表实体的页面的规范永久 URL。 当您使用开放图谱标签时,“赞”按钮会发布指向 og:url 的链接,而不是“赞”按钮代码中的 URL。
  • og:site_name - 人类可读的网站名称,例如“IMDb”。
  • fb:adminsfb:app_id - 页面管理员的 Facebook ID 或 Facebook 平台应用程序 ID 的逗号分隔列表。 至少仅包含您自己的 Facebook ID。

有关开放图谱标签的更多信息以及有关管理页面的详细信息,请参阅开放图谱协议文档。

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

The easiest way is just a link tag:

<link rel="image_src" href="http://stackoverflow.com/images/logo.gif" />

But there are some other things you can add to your site to make it more Social media friendly:

Open Graph Tags

Open Graph tags are tags that you add to the <head> of your website to describe the entity your page represents, whether it is a band, restaurant, blog, or something else.

An Open Graph tag looks like this:

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

If you use Open Graph tags, the following six are required:

  • og:title - The title of the entity.
  • og:type - The type of entity. You must select a type from the list of Open Graph types.
  • og:image - The URL to an image that represents the entity. Images must be at least 50 pixels by 50 pixels. Square images work best, but you are allowed to use images up to three times as wide as they are tall.
  • og:url - The canonical, permanent URL of the page representing the entity. When you use Open Graph tags, the Like button posts a link to the og:url instead of the URL in the Like button code.
  • og:site_name - A human-readable name for your site, e.g., "IMDb".
  • fb:admins or fb:app_id - A comma-separated list of either the Facebook IDs of page administrators or a Facebook Platform application ID. At a minimum, include only your own Facebook ID.

More information on Open Graph tags and details on Administering your page can be found on the Open Graph protocol documentation.

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

相思故 2024-08-02 12:08:39

我知道这个问题很老了,但我最近处理了完全相同的问题,并且反复讨论了几周。 在 Google 上进行的多次搜索发现了很多有用的信息,但其中大部分都集中在 Open Graph 标签上,我对使用这些标签不感兴趣。 事实证明,我的网站存在多个问题,但以下是一些基本问题。

  1. 正如 EventyEight 所说,确保您的 HTML 有效 - 对于您的 javascript 和服务器端代码(PHP、ASP 等)也是如此。 我在一段代码中遇到了一个小的 PHP 错误,该代码是作为从主页对服务器的单独调用而执行的。 由于一些奇怪的巧合,该代码生成了 500 错误 - 但仅适用于 IE6 和严格的解析引擎,如 W3C 验证器和 Facebook 页面爬虫。 这个问题在现代浏览器(Chrome 4、FF 3.5、IE 8 等)中没有出现,所以我没有立即看到它,但较旧/更严格的客户端每次都会显示 500,这就是 FB 不显示的主要原因不抓取我们的页面(当其他一切似乎都正确时)。

  2. 关于兰迪的回应,他认为 Facebook 会在您更新页面后很长时间内保留您页面的旧缓存副本,这一点是正确的。 FB声称它只保留24小时,但我经历的时间比这要长得多。 幸运的是,FB 发布了他们的“URL Linter”工具,该工具将向您展示您的页面在 FB 上共享时的显示方式,并且它将强制 FB 立即更新其页面缓存。 这是一个救生工具。 您可以在http://developers.facebook.com/tools/lint/< /p>

  3. < p>关于 URL Linter 工具,请注意 URL 的每个变体都在 Facebook 上单独缓存,因此“www.example.com”与“example.com”不同。 此外,还会存储唯一的大写,因此“ExampleOne.com”与“exampleone.com”不同。 (当我觉得缓存已经更新得很好,而客户却声称他们没有看到更新时,这导致我的客户和我自己之间产生了很多困惑。原来我在寻找在 exampleone.com 上,并使用 Linter 来更新缓存,但他们正在查看我没有提交给 Linter 的 exampleOne.com,因此,我最终向 Linter 提交了相当多的 URL 变体,只是为了覆盖。 )

  4. WyrdNEXUS 关于使用 image_src 链接标签的建议是正确的。 这可以让您确保 FB 正在为您的页面抓取最佳的图像。 关于图像文件应具有的规格有一些不同的准则,但我已成功使用 128 像素的方形图像,并且也看到 130x97 的图像也能通过。 以下是 Facebook 的官方文档 http://developers.facebook.com/docs/reference/插件/喜欢/

    <块引用>

    图像必须至少为 50 像素 x 50 像素。 方形图像效果最佳,但您可以使用宽度最多为高度三倍的图像。

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

  5. 关于 Mike Cooper 的 eHow 文章链接,请避免使用该文章中的步骤 #1。 当撰写文章和 Mike 发布链接时,这是有效的建议,但现在最好使用 URL Linter 工具来预览页面在共享时的显示方式。 通过使用 Linter,您不会导致 FB 在您有机会调整页面之前缓存该页面的(可能)错误副本。

I know this question is old, but I recently dealt with the exact same problem and went round and round on it for a couple weeks. Multiple searches on Google turned up a lot of useful information, but most of it was focused on Open Graph tags, which I wasn't interested in using. Turns out my site had multiple issues, but here are some of the basics.

  1. As EightyEight said, make sure your HTML is valid - and the same goes for your javascript and server-side code (PHP, ASP, etc.). I had a small PHP error in a piece of code that was executing as a separate call to the server from the main page. Due to a number of bizarre coincidences, that code was generating a 500 error - but ONLY for IE6 and strict parsing engines like the W3C validator and the Facebook page crawler. The problem didn't appear in modern browsers (Chrome 4, FF 3.5, IE 8, etc) so I didn't see it right away, but older/stricter clients were showing the 500 every time and that was the main reason FB wasn't crawling our page (when everything else seemed to be correct).

  2. Regarding Randy's response, he's correct that Facebook will keep an old cached copy of your page long after you've updated it. FB claims it's only held for 24 hours, but I experienced much longer times than that. FORTUNATELY, FB has released their "URL Linter" tool that will show you a preview of how your page will appear when being shared on FB, and it will force FB to instantly update its cache of your page. This was a lifesaving tool. You can find it at http://developers.facebook.com/tools/lint/

  3. Regarding the URL Linter tool, be aware that each variation of a URL is cached separately on Facebook, so "www.example.com" is not the same as "example.com". Also, unique capitalization is stored as well, so "ExampleOne.com" is not the same as "exampleone.com". (This led to a lot of confusion between my client and myself when it appeared to me that the cache had been updated just fine and the client claimed they weren't seeing the updates. Turns out I was looking at exampleone.com and had used Linter to update the cache, but they were looking at exampleOne.com which I hadn't submitted to Linter. As a result, I ended up submitting quite a few variations of the URL to Linter just to cover the bases.)

  4. WyrdNEXUS's advice to use the image_src link tag is spot-on. This allows you to be sure that FB is scraping the best possible image for your page. There are some varying guidelines out there about what specs the image file should have, but I've successfully used a 128px square image and have seen a 130x97 image make it through as well. Here is Facebook's official documentation from http://developers.facebook.com/docs/reference/plugins/like/:

    Images must be at least 50 pixels by 50 pixels. Square images work best, but you are allowed to use images up to three times as wide as they are tall.

    Obviously, FB will resize a large image for you, but you'll almost always get better results if you resize it yourself beforehand.

  5. Regarding Mike Cooper's link to the eHow article, avoid using step #1 in that article. It was valid advice when the article was written and when Mike posted the link, but it's now better to use the URL Linter tool for previewing how your page will appear when being shared. By using Linter, you won't cause FB to cache a (potentially) bad copy of the page before you get a chance to tweak it.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文