Юрий Гец

В 23.12.2017 в 12:42, Tilonorrinco сказал:

Если что-то не работает, можно протестировать в онлайн-сервисах (точно есть у фейсбука и твиттера, обычно если в них все норм, то и на других сайтах тоже). Там обычно все довольно подробно расписано.

Вот ссылка на дебаггер фейсбука: 

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

На фейсбуке погружается картинка с Мэрилин, ссылка на которую возвращает 404 страницу. Поэтому изображение не отображается.

В телеге все работает норм и подгружает фотографию.

У некоторых сервисов есть своя специфика: где-то есть ограничения по минимальному размеру изображения, где-то требуются только абсолютные пути в ссылках, определенные расширения и т.п. Можно конечно все это гуглить, но самый простой вариант -- взять сайт, где все работает норм, типа habrahabr и скопировать все теги оттуда, подправив содержание и ссылки по-аналогии.

Если подгружается старая картинка, можно очистить кэш (на сайте дебаггера для каждой соцсети) или подождать.

Спасибо! Помогла смена размера фото и возможно типа файла (с .png на .jpg). Возможно кнопка "Повторить скрапинг" тоже помогла.

Правда теперь на этом ФБ дебаггере после скраппинга пишет ошибку:

Цитата

Отсутствуют следующие необходимые объекты монетизации: fb:app_id

Можно в него указать ссылку на мой Facebook профиль или оставить без указания этого параметра или ....?

Но, главное, что фото подтягивается при вставке.

В 21.12.2017 в 20:03, Tilonorrinco сказал:

Пропиши opengraph атрибуты в meta-тэгах.

За картинку отвечает тэг og:image

Примеры в листингах по ссылке.

http://ogp.me/

Подробнее по-русски:

https://yandex.ru/support/webmaster/open-graph/intro-open-graph.xml

 

 

Спасибо, вставил в Head сразу под Title:

<meta property="og:image" content="https://i.imgur.com/EfCi3s5.png" />
<meta property="og:image:secure_url" content="https://i.imgur.com/EfCi3s5.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="100px" />
<meta property="og:image:height" content="100px" />
<meta property="og:image:alt" content="Юрий Гец" />

Пока результата не увидел, может нужно время? Или что-то не так?

p.s. пробовал без закрывающих слешей в конце (как у Яндекса) – не помогло. Как и указание размера просто цифрами без пиксел (px).

Можете посмотреть исходник тут:

https://yurii-hets.blogspot.com/

Как задать через html или css или ещё как-то – изображение, которое автоматически подтягивается при вставке ссылки в поле ввода сообщения (например в VK или Facebook)?

Прикрепил 2 примера.