Как адаптировать ваш сайт, блог или лендинг пейдж под социальные сети

Адаптируем сайт под социальные сети
Социализация – одна из самых важных задач для сайтов и блогов. Старое SEO постепенно отходит на второй план, отдавая первенство социальным сетям. Твой сайт чаще упоминают в социальных сетях – и он тут же начинает продвигаться в выдаче поисковых систем.

Но как интегрировать сайт или блог с социальными сетями? А главное, сделать это быстро и эффективно? Чтобы узнать об этом, приглашаю всех под кат.

Лендинг пейдж

Здесь можно наблюдать проблему масштаба страны – практически ни один лендинг пейдж не адаптирован под социальные сети.

Как это исправить?

Для начала создадим тестовую страницу в ВКонтакте. На ее примере я покажу все наглядно.

Для теста берем любой лендинг пейдж, например, компании ТКС. Пробуем вставить ссылку на него в пост, вот что у нас выходит:
неправильная адаптация под социальные сети

Как мы видим, все достаточно печально: Непонятный загаловок страницы, состоящий из набора несвязных слов, описание отсутствует вовсе + картинка подтягивается совсем плохая (Хотя на самом сайте картинки обалденные).

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

правильная адаптация сайта под социальные сети

Видим: заголовок, рассказывающий о продукте, описание сайта и картинку – ту, которую мы хотели, а не которая была от балды подхвачена социальной сетью.

То же самое, кстати, мы будем наблюдать и в facebook.

Сделать все по уму очень просто.

Есть протокол, который называется Open Graph. Он отвечает за сбор мета-данных из социальных сетей. Для того, чтобы у нас все работало хорошо, нам нужно будет вставить в шапку сайта или лендинг пейдж небольшой кусок кода:

Напоминаю, данный код нужно вставить в шапку сайта или лендинга, то есть между тегами head.

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

Внимание: после вставки кода, вы можете столкнуться с проблемой – социальные сети будут игнорировать эти данные. Все дело в том, что и ВК и ФБ кэшируют информацию.

Избавляемся от этих проблем:

1) Переходим по ссылке в ВК. Опускаемся в низ страницы, в поле url вводим ссылку на наш ресурс и нажимаем “Выполнить”.

Адаптация сайта под социальные сети

Если видим после этого надпись “response: 1″, значит мы все сделали правильно.

2) Идем дальше. Переходим по этой ссылке для facebook. Вводим ссылку на свой ресурс и нажимаем “Fetch new scrape information”.

Тем самым мы обновили кэш социальных сетей.

Готово. Теперь радуемся, какие мы молодцы.

Блог

С блогом все немного сложнее. Так как здесь у нас у каждого поста или страницы нужно подхватывать разную информацию, предыдущий способ не сработает. Ну, ничего, мы и с этим справимся.

Для начала нам нужно будет найти файл functions.php на своем блоге. Если из админки работать с ним не получается, то придется зайти на блог по фтп и найти его в папках: public_html – wp-content – themes – ваша тема.

И добавить туда следующий код:

Он сделает ту же самую операцию, о которой я рассказывал в начале поста, но уже для каждого из постов и страниц блога. То есть, вам не придется мучаться.

Далее, если ваша тема старого образца, то в файле header.php (шапка блога) вы найдете следующий код:

Его нужно будет заменить на этот:

Теперь ваш блог адаптирован под социальные сети.

Сайт

Здесь нужно исходить из того, смиотря на каком движке стоит ваш сайт.

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

Если CMS сайта – WordPress, повторяем действия, описанные мной для блога.

Полную же информацию по Open Graph можно найти на официальном сайте данного протокола: Open Graph.

Если вы столкнулись с какими-то проблемами в данном вопросе, напишите о них в комментариях, попытаемся решить их вместе.

Ну, и лайк, если пост был вам полезен.

Понравился пост? Помогите распространить его в социальных сетях, это сделает мир немного лучше и добавит вам плюсик в карму:

Прокомментируйте от ВК:

Или любым другим способом: