*Рекламный обзор
Доброго дня, читатели Блога SEO-Дилетанта. Кнопки «Поделиться» и «Подписаться на обновления» необходимы любому сайту для привлечения аудитории из социальных сетей. Нужно это всем сайтам без исключения, и блогам, и развлекательным ресурсам, и коммерческим сайтам.

Для меня, как web-дизайнера и web-разработчика поиск удобных кнопок и в целом инструментов для социализации ресурсов не прекращается никогда. Каждый сайт, с которым я работаю, я социализирую:

1. Устанавливаю кнопки социальных сетей для подписки на страницы, группы и сообщества.
2. Устанавливаю кнопки «Поделиться».

Одной из находок 2016 года стал сервис uSocial.pro.

Пока одни сервисы делали только кнопки «Like» и «Поделиться», uSocial.pro охватил всю нишу целиком, разработав ко всему прочему конструктор META-данных, uSocial Debug, инструмент для привлечения посетителей — блок «Подписаться» и свою статистику по использованию кнопок.

Конструктор кнопок

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

Блоки кнопок «Поделиться» и «Like» удобно собираются с помощью конструктора:

Кроме популярных социальных сетей можно добавить кнопки «Печать», «В закладки», «Отправить на email».

Когда включите для блока «Поделиться» мобильный вид, то для пользователей мобильных устройств появится возможность отправлять ссылки на ваш сайт в Viber, WhatsApp, Telegramm и по SMS.

Дизайн кнопок

uSocial предоставляет широкие возможности по настройке внешнего вида кнопок.

Можно выбрать форму, размер и цвет кнопок:

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

Круглые понравились больше всего.

С помощью настроек ориентации и положения можно вписать кнопки в любое место на сайте:

Код виджета

Как и любые другие кнопки социальных сетей, uSocial предполагает установку кода на сайт. Этот код работает асинхронно (как рекомендует Google PageSpeed). Такой подход позволяет не опасаться за повышение скорости загрузки страниц.

Статистика

По использованию кнопок ведется статистика в личном кабинете. Чтобы получить к нему доступ, нужно зарегистрироваться и только после этого создавать набор кнопок (о чём я писала выше).

После регистрации можно следить за количеством просмотров кнопок и репостам:

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

Конструктор META-данных

Конструктор meta-данных позволяет задать вид репостов для Facebook, ВКонтакте, Twitter и Google+. При этом используются схемы Open Graph protocol и Schema.org.

Инструмент генерирует разметку для социальных сетей. После ее размещения в шаблонах материалов вид репостов будет задан определенным образом, а не так как посчитает нужным социальная сеть.

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

А так он выглядит в Вконтакте и должен быть таким в Facebook:

За правильное отображение анонса отвечает специальный код мета-данных, который должен размещаться в файлах темы WordPress. Конечно, после того, как код мета-данных будет сформирован в инструменте uSocial, его нужно правильно разместить в блоге. Но это тема отдельной статьи. У меня есть эта проблема, я буду ее решать и позже поделюсь своими успехами.

Кнопки uLike

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

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

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

Привлечение посетителей

Инструмент «Привлечение посетителей» позволит в режиме конструктора создать всплывающее окно с приглашением подписаться на группы в социальных сетях:

Как и в других конструкторах от uSocial, здесь есть возможность гибкой настройки приглашения:

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

uSocial Debug

Приятное дополнение к предыдущим инструментам — uSocial Debug.

Он позволяет очистить кеш страниц сайта в Facebook и ВКонтакте. После очистки кеша в следующем репосте данные о странице будут соответствовать указанной в шаблоне микроразметке. Это полезно, когда вы только начинаете ее внедрять и не знаете точно, как репосты будут выглядеть в социальных сетях.

Установка кнопок «Поделиться» на сайт

Существует несколько способов установки кнопок на сайт, в зависимости от того, что вам нужно и в каком месте. На сайте uSocial есть раздел с инструкциями по установке. Я расскажу только про установку кнопок внизу статьи.

Создаём набор в uSocial и копируем полученный HTML-код.

В панели управления сайтом в левом меню выбираем пункт «Внешний вид» — «Редактор»:

Находим нужный шаблон. В зависимости от используемой темы, название шаблона может отличаться. Будьте внимательны. Чаще всего нужный шаблон имеет название content.php, встречалось мне и название content-single.php, если ваша тема очень старая или уникальная, то нужное место можно найти в файлах index.php, single.php или других, какие у вас есть.

Далее самостоятельно находите место в файле шаблона, куда нужно установить кнопки. Как правило, это внутри или перед контейнером:

Не путайте с подвалом всего сайта (файл footer.php), здесь идет речь только о разделе внизу статьи с информацией об авторе, дате написания поста, категориях и метках.

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

//Код кнопок
 

Не забудьте сохранить изменения в шаблоне.

Стоимость uSocial

Весь функционал uSocial доступен бесплатно и это не может не радовать, за исключением кнопки uLike. Данная кнопка доступна только в тарифе Premium. В целом же платные тарифы расширяют и без того широкие возможности инструментов:

Подробнее о тарифах можно почитать по ссылке.

[ads1]Несмотря на то, что это рекламный обзор, я рекомендую сервис uSocial для использования, т.к. на сегодняшний день uSocial.pro обладает самым широким бесплатным функционалом и удобен в использовании и для новичков, которые вообще не разбираются в сайтостроении, и для профессионалов.

Удачи в развитии ваших ресурсов!