Своя картинка у ссылки в мессенджере
На днях обратился клиент с необычной просьбой. Как прикрепить изображение к ссылке на свой сайт, которую отправляет в viber. Он сдает квартиры в аренду и отправляет ссылку на страничку с описанием, фотография здесь очень кстати. У него же вместо фотографии интерьера, прикреплялось изображение кнопки счетчика.
Изучая вопрос наткнулся на статью и напишу сюда выводы.
Исчерпывающих материалов по оптимизации страниц сайта для мессенджеров нет и в документации искать бесполезно. Для отображения внешних ссылок используются метатеги OpenGraph: og:title заголовок, og:description анонс, og:image изображение.
Заголовки и описание лучше делать короткими, понятными с первых слов.
Проблема возникает с картинками: непонятно какая попадет в мессенджер и в каком формате. Facebook использует картинки из OpenGraph, предпочитает их большими и прямоугольными. Мессенджеры отображают их маленькими и квадратными. Можно получить такой результат:
Чтобы квадратная картинка показывалась в мессенджерах, а большая прямоугольная уходила в FB, делаем в метатегах конструкцию:
<meta property=”og:image” content=”/small-im.png” /> <!— для Viber —>
<meta property=”og:image” content=”/large-fb.png” />
<meta property=”og:image” content=”/small-im.png” /> <!— для Telegram & WhatsApp —>
Гарантий нет: после очередных обновлений в отдельных мессенджерах конструкция может не работать.
Вы знаете другое решение или искали решение в для других программ? Делитесь, очень интересно.
Ссылка на описание сайта клиента, который мы разрабатывали.