Facebook链接缩略图 [英] Facebook link thumbnail

问题描述

当在Facebook中发布指向某个网站的链接时（Google+和剩余计数），您会看到一个缩略图或一些缩略图供您选择。这些是来自HTML的标签。

我一直认为，使用CSS在h1标签中使我的标志成为背景图片是一个好习惯。我使h1标签链接回到主页，并隐藏标题文本与{text-indent：-9999px}，留下一个可爱的语义HTML标题。如果你想看看，这里是我的网站的链接： http://tempertemper.net

这个问题是，因为它是一个背景图片，它被忽视了。

这是一个好主意，发布一个自定义的HTML的顶部为此目的只有，并将其隐藏在页面的一侧？我不知道，似乎有点凌乱。我可以把标签放在h1内，但是标志不是正确的形状，因为它是为特定目的设计的。

也许有一个元标签目的或可能有一种技术，以强制FB拉出一个特殊的图像，没有正常加载？

Martin。

$

b $ b

解决方案

是的，您可以设置元标记，以便Facebook知道要选择哪个图像。

请参阅： https://developers.facebook.com/docs/ opengraph /

具体来说，它是 og：image 属性，它会告诉Facebook的链接共享脚本以选择该图像作为其缩略图。

请记住，虽然Facebook做了一些缓存，所以如果你已经共享了链接，一旦它可能仍然卡住使用旧的图像。

您可以通过使用Facebook URL Linter了解Facebook从您的网站中离开。请参阅： http://developers.facebook.com/tools/lint/ （使用URL Linter也会重建Facebook的缓存）

When posting a link to a website in Facebook (Google+ and the rest count too) you're given a thumbnail, or selection of thumbnails to choose from. These are tags from the HTML.

I've always been of the opinion that it was good practice to make my logo a background image inside a h1 tag using CSS. I make the h1 tag a link back to the home page and hide the header text with something like {text-indent: -9999px}, leaving a lovely semantic HTML header. Here's a link to my site if you want a look: http://tempertemper.net

The problem with this is that as it's a background image it's overlooked.

Would it be a good idea to post a custom at the top of the HTML for this purpose only, and hide it off the side of the page? I don't know, seems a bit messy. I could just put the tag inside the h1, but the logo wouldn't be the right shape as it's designed for a specific purpose.

Maybe there's a meta tag for this purpose or maybe there's a technique to force FB to pull a specific image that isn't loaded normally? Does anyone have any ideas or top tips for this?

Thanks!

Martin.

解决方案

Yes, you can set a meta tag so that Facebook knows which image to pick.

See: https://developers.facebook.com/docs/opengraph/

Specifically, it is the og:image property, and it will tell Facebook's link share script to choose that image as its thumbnail.

Keep in mind though that Facebook does some caching, so if you've already shared the link once it may still be "stuck" on using the older image.

You can see whats Facebook getting out of your website by using the Facebook URL Linter. See: http://developers.facebook.com/tools/lint/ (The use of the URL Linter will also rebuild Facebook's cache)

这篇关于Facebook链接缩略图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！