Как исправить отображение ссылки на сайт в соцсетях

Как исправить отображение ссылки на сайт в соцсетях

Что делать, если ссылка в мессенджерах и социальных сетях выглядит некорректно

Вы создали сайт, решили им поделиться и тут возникла проблема – ссылка на сайт в социальных сетях выглядит не так, как задумывалось. В статье мы разберем проблему и рассмотрим инструменты, которые нам помогут: для Facebook, ВКонтакте, Telegram и Twitter.

Перед тем, как делиться страницей в социальных сетях или мессенджерах, проверьте настройки на Тильде. Отображение ссылки на сайт в социальных сетях зависит от того, какая информация задана в Настройках страницы → Соцсети → Отображение в соцсетях и мессенджерах.

Если там не указана информация, то Заголовок и Описание в предпросмотре берутся из полей вкладки Главное в Настройках Страницы, а бейдж из вкладки Бейджик. Если бейджик не загружен, то используется первое изображение со страницы.

Если все значения заданы и страница опубликована, а ссылка в социальных сетях выглядит некорректно, то стоит обратиться к сервисам для обновления предпросмотра ссылок.

Обновление данных в Facebook

Использование инструмента Sharing Debugger

Компания Meta Platforms Inc., владеющая социальными сетями Facebook и Instagram, по решению суда от 21.03.2022 признана экстремистской организацией, ее деятельность на территории России запрещена.

Sharing Debugger — сервис предпросмотра ссылок для Facebook.
С его помощью можно обновить предпросмотр определенной ссылки в Facebook. Укажите ссылку и нажмите кнопку «Debug». После этого сервис обновит информацию в соответствии с актуальными данными страницы.

Если же вы укажите ссылку на страницу, которую еще не публиковали в Facebook, то после клика на «Debug» вы получите соотвествующее уведомление. Нажмите на кнопку «Получить новую информацию об URL» (Fetch new information) . Информация обновится и новые данные отобразятся внизу страницы.

Если с обновлением предпросмотра в Sharing Debugger возникают проблемы:

  • нужно проверить, нет ли в записях вашего подключенного домена АААА-записей
  • правильно ли указан адрес страницы в Настройках страницы → SEO → Отображение в поисковой выдаче
  • нет ли поставленной галочки в Настройках сайта → SEO напротив пункта «Использовать схему HTTPS» при отключенном https

Для того, чтобы после нажатия на кнопку шеринга не было надписи Tilda, в Настройках страницы → Соцсети нужно указать APP ID Facebook. APP ID можно создать по этой инструкции от Facebook.

Аналогичного инструмента для приложения Whatsapp нет. Нужно подождать — превью обновится самостоятельно.

Обновление данных во ВКонтакте

Использование очистки предпросмотра кеша (метод pages.clearCache)

Для обновления данных в социальной сети ВКонтакте есть специальный инструмент https://dev.vk.com/method/pages.clearCache. Он довольно прост — нужно получить access token, вставить ссылку на вашу страницу, нажать кнопку «Выполнить».

Как получить access token?

Перейдите по ссылке https://vk.com/editapp?act=create, задайте понятное вам название, тип приложения — «Сайт», адрес сайта — укажите ссылку на вашу страницу, пропишите ваш базовый домен. Нажмите «Подключить сайт».

Оставьте поле с настройками ключа пустым — метод не требует особых доступов, нажмите «Сгенерировать».

Access token получен.
Напишите URL страницы, для которой требуется очистить предпросмотр.
Нажмите «Выполнить». При удачной очистке кеша – метод возвращает код «1».

Обновление данных в Телеграме

Использование бота @Webpagebot

В Telegram существует специальный бот — @Webpagebot, с помощью которого можно обновить кеш предпросмотра. Для этого нужно использовать команду Start (Начать), затем прислать боту до 10 ссылок, предпросмотр которых нужно обновить.

Обновление данных в Twitter

Использование инструмента Twitter Card Validator

Для Twitter существует сервис Twitter Card Validator. С помощью него можно обновить превью ссылок, вставив ссылку в поле, но для этого нужно, чтобы на Тильде был заполнен параметр «Твиттер-аккаунт», который находится в в Настройках страницы → Соцсети.

Отображение ссылки на сайт в социальных сетях зависит от того, какая информация задана в Настройках страницы → Facebook and SEO → Отображение в Фейсбуке. Если там не указана информация, то Заголовок и Описание в предпросмотре берутся из полей вкладки Главное в Настройках Страницы, а бейдж из вкладки Бейджик (если бейжик не загружен, то берется первое изображение со страницы).

Если все значения заданы и страница опубликована, а ссылка в социальных сетях выглядит некорректно, то стоит обратиться к сервисам для обновления предпросмотра ссылок.

Подробная инструкция Как исправить отображение ссылки на сайт в соцсетях.

😼

Выбор
редакции

5 Марта 2020


2 035



В избр.
Сохранено

Как улучшить отображение сайта в соцсетях

Небольшая деталь, о которой часто забывают

Красивая ссылка на сайт

Вы замечали как отображаются ссылки в переписке Вконтакте? Кто-то из друзей скидывает вам ссылку на сайт, и она может выглядеть хорошо, а может — не очень. Ниже два примера.


Хорошо выглядит та ссылка, которая отображает картинку, адрес и краткую информацию о сайте (пример справа). Всё это называется умным словом сниппет (snippet — кусочек, отрывок, фрагмент).

Сниппет не может сам получиться красивым, для этого в коде прописываются специальные параметры. Если не указать, какая картинка должна отображаться в ссылке, то Вконтакте или Facebook сам выберет её на сайте. Если картинка неправильных пропорций, то в сниппете она может быть плохого качества или просто растянуться.

У каждой соцсети свои параметры отображения, поэтому для каждой прописываются настройки. Если текст можно просто дублировать, то изображение надо сделать в заданных пропорциях для каждого сайта.

Проверка изображения сниппета

Проверить как отображается свой сайт несложно.

Вконтакте просто киньте ссылку на свой сайт в сообщениях и сразу увидите как отображается сниппет.

Для проверки сниппета в Facebook откройте Facebook Debugger. Введите адрес страницы и нажмите на кнопку «Получить новую информацию о URL».

Внизу страницы в пункте «При перепосте это будет включено» отобразится предпросмотр ссылки.


Как сделать сниппет для своего сайта

1. Подготовьте две картинки, одну для Facebook (1200 × 628 px), вторую для Вконтакте (537 × 240 px).

2. Загрузите картинки на свой или какой-нибудь сторонний сервер. Главное, чтобы у вас была ссылка с прямым доступом к этим изображениям. Например, вот пример с нашего сайта: https://furnas.ru/6053b43d4b83b82f20b7b8f632d9f721.png

3. В html-код всех страниц вашего сайта раз добавьте между тегами <head> </head> следующий код:

<meta property=»vk:image» content=»{ссылка_на_картинку_для _вк}»/>
<meta property=»og:image» content=»{ссылка_на_картинку_для _facebook}»/>

4. Проверьте, что всё получилось. Facebook сразу не обновляет данные, зайдите на Facebook Debugger, введите адрес сайта и нажмите на кнопку «Получить новую информацию о URL». Так Facebook обновит данные о вашем сайте.

Можем помочь сделать

Для тех, кто дочитал статью сделаем небольшой подарок. Мы можем бесплатно сделать для вас картинки нужного размера и разместить на своем сервере, просто зайдите на sharemaster.tilda.ws и оставьте заявку.

Блог проекта

Расскажите историю о создании или развитии проекта, поиске команды, проблемах и решениях

Написать

Личный блог

Продвигайте свои услуги или личный бренд через интересные кейсы и статьи

Написать

2021.08.27

Как исправить отображение ссылки на сайт в соц.сетях?

Что делать, если ссылка на сайт в мессенджерах и социальных сетях выглядит не так, как нужно?

Вы создали сайт, решили им поделиться и тут возникла проблема: ссылка на сайт в социальных сетях выглядит не так, как задумывалось. В этой статье мы разберем как решить проблему и рассмотрим инструменты, которые нам помогут: для Фейсбука, ВКонтакте, Телеграма, Вотсапа и Твиттера.

Обновление данных в Facebook

Использование инструмента Facebook Debugger

Facebook Debugger — это сервис для предпросмотра ссылок для Facebook. С его помощью можно обновить предпросмотр определенной ссылки в Facebook, введя на странице адрес и нажав кнопку «Получить новую информацию об URL» (Fetch new information). Информация обновится и новые данные отобразятся внизу страницы.

Если с обновлением предпросмотра в FB Debugger возникают проблемы, то нужно проверить, нет ли в записях вашего подключенного домена АААА-записей (они могут мешать предпросмотру), правильный ли указан адрес страницы в Настройках страницы → SEO → Отображение в поисковой выдаче и нет ли поставленной галочки в Настройках сайта → Еще напротив пункта «Использовать HTTPS» при отключенном https.

Обновление данных в ВКонтакте

Использование очистки предпросмотра кеша (метод pages.clearCache)

Для обновления данных в социальной сети ВКонтакте есть специальный инструмент https://vk.com/dev/pages.clearCache. Он довольно прост — достаточно вставить ссылку на вашу страницу, нажать кнопку «Выполнить» и в случае удачной очистки кеша предпросмотра вашей ссылки инструмент отдаст код «1».

Обновление данных в Телеграме

Использование бота @Webpagebot

В Телеграме существует специальный бот — @Webpagebot, с помощью которого можно обновить кеш предпросмотра через интерфейс бота. Для этого нужно использовать команду /updatepreview, а потом прислать боту до 10 ссылок, предпросмотр которых в Телеграме вы хотите обновить.

Обновление данных в Whatsapp

Нужно зайти из панели администратора в Настройки > Шаблоны сайтов, открыть шаблон вашего сайта
и найти строчку og:image. Её нужно заменить на:
<meta property=»og:image» itemprop=»image» content=»ссылка_на_ваш_логотип»>

Обращаем ваше внимание на то, что Whatsapp не поддерживает изображения размером более 300КБ.

Обновление данных в Twitter

Использование инструмента Twitter Card Validator

Для Twitter существует сервис Twitter Card Validator. С помощью него можно обновить превью ссылок для Твиттера, вставив ссылку в поле.

Наши решения

Вы можете настроить, как будет выглядеть ссылка на ваш сайт при ее публикации в социальных сетях или отправке через мессенджеры. Например, при публикации в соцсети ссылки https://craftum.com/ отобразится следующий пост:

Чтобы выполнить аналогичную настройку для вашего сайта, сделайте следующее.

1. В разделе «Сайты» наведите курсор на нужный сайт — появится значок шестеренки. Кликните на него.

2. Перейдите в раздел «Социальные сети».

3. Добавьте изображение — превью (или «бейджик»), которое будет отображаться при публикации. Заполните поля «Заголовок» и «Описание» — они помогут пользователям понять, какую информацию и услуги можно найти на вашем сайте.

4. Нажмите «Сохранить».

Также перейти к настройкам можно со страницы конкретного сайта в конструкторе, по клику на значок шестеренки:

Если вы опубликовали ссылку на свой сайт в социальных сетях и после этого изменили картинку-превью или текст, при повторном размещении данные могут не обновиться, так как сохранились в кэши соцсети. Чтобы обновить отображение ссылки, воспользуйтесь инструкцией ⤵️

Что делать, если отображение для соцсетей не обновилось?

Понравилась статья? Поделить с друзьями:
  • Как найти определенную строку в тексте
  • Как найти sin 405
  • Как найти дело по уголовному делу
  • Как составить диалог по тексту на казахском языке
  • Тв приставка показывает 10 каналов вместо 20 как исправить