Изображение веб-сайта по умолчанию для социального обмена

Есть ли способ установить образ по умолчанию, который появляется, когда я делюсь своим сайтом на Facebook? Я заметил, что Facebook обычно извлекает первое изображение с сайта для использования в качестве миниатюры.

Ответ 1

Вам нужно установить метатег изображения facebook:

<meta property="og:image" content="http://example.com/logo.jpg">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1024">
<meta property="og:image:height" content="1024">

Для получения дополнительной информации проверьте docs

Ответ 2

<meta property="og:image" content="http://example.com/lamb-full.jpg">
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:width" content="200">
<meta property="og:image:height" content="200">

Размер изображения должен быть не менее 200 пикселей x 200 пикселей

Ответ 3

Серверы Facebook будут "очищать" ваш сайт, ища изображение, которое будет использоваться, когда люди его делят. Если вы хотите указать, какое изображение использовать, поместите это в раздел <head></head> на своем веб-сайте:

<meta property="og:image" content="http://url-to-your-image.png">

Facebook может кэшировать копию предыдущего случайного изображения. Чтобы снова получить фейсбук:

https://developers.facebook.com/tools/debug/

Ответ 4

Установите og:image в <head> вашего документа HTML следующим образом:

<meta property="og:image" content="http://example.com/ogp.jpg" />

Это часть протокола Open Graph, соблюдаемого, по крайней мере, следующими сайтами социальных сетей:

Facebook (см. https://developers.facebook.com/docs/sharing/webmasters/#images)
Twitter (см. https://dev.twitter.com/cards/getting-started#opengraph)
LinkedIn (см. https://developer.linkedin.com/docs/share-on-linkedin)
Google+ (см. https://developers.google.com/+/web/snippet/)
Pinterest (см. https://developers.pinterest.com/docs/rich-pins/reference/)

(... и, вероятно, еще много.)

Помимо установки тега выше, вы также можете:

Очистите кэшированную версию вашего медиафайла (например, с помощью инструментов разработчика платформы), чтобы отобразить мгновенное изменение. Например, вы можете сделать это для Facebook, https://developers.facebook.com/tools/debug/
Добавьте дополнительные "структурированные свойства", чтобы указать такие вещи, как ширина или высота изображения, используя синтаксис, описанный в http://ogp.me/#structured. Это описано как "лучшая практика" Facebook на https://developers.facebook.com/docs/sharing/best-practices#images.