Изображение нужно загрузить на ftp в папку с сайтом. Далее отредактировать HTML-код, вписав на нужные вам страницы в разделе <head> следующий код:
<!-- Facebook Meta Tags -->
<meta property="og:url" content="https://mozilla.org">
<meta property="og:type" content="website">
<meta property="og:title" content="Choose your language or locale to browse Mozilla.org">
<meta property="og:description" content="Select your country or region to indicate your preferred language.">
<meta property="og:image" content="
https://www.mozilla.org/media/img/mozorg/mozilla-256.4720741d4108.jpg">
<!-- Twitter Meta Tags -->
<meta name="twitter:card" content="summary_large_image">
<meta property="twitter:domain" content="mozilla.org">
<meta property="twitter:url" content="https://mozilla.org">
<meta name="twitter:title" content="Choose your language or locale to browse Mozilla.org">
<meta name="twitter:description" content="Select your country or region to indicate your preferred language.">
<meta name="twitter:image" content="
https://www.mozilla.org/media/img/mozorg/mozilla-256.4720741d4108.jpg">
После этого остаётся лишь заполнить его своими значениями по следующей схеме:
— og:url, twitter:url — ссылка на текущую страницу (лучше генерировать с помощью вашей CMS)
— og:type — website
— og:title, twitter:title — заголовок страницы, проще всего дублировать значение из <title>
— og:description, twitter:description — описание страницы, проще всего дублировать из meta description
— og:image, twitter:image — указать полную ссылку на картинку-превью (можно прописать одну картинку для всех страниц либо настроить через CMS разные картинки для разных страниц)
Вот что в итоге получилось у меня:
Нет комментариев