15 июня 2016 г.

Блоки социальных сетей Uptolike для Blogger

Всем привет!

Как говорится, нет предела совершенству! Перед вами очередной, третий по счету, обзор сервиса "кнопок социальных сетей" для блога (или сайта). Напомню, я уже рассказывал про кнопки соцсетей от Pluso и аскетичный, зато мега-надежный вариант от Яндекса. Сегодня расскажу про самый функциональный сервис из представленных - Uptolike. Располагается он по адресу uptolike.ru и предлагает не только простой способ поделиться заметками для посетителей, но и гибкий инструментарий для вебмастера.

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

  • Поделиться
  • Лайки
  • Подписаться
  • Поделиться картинкой
  • Рейтинг статей ("плюсы" и "минусы" под материалами)
  • Невидимый счетчик
Для распространенных CMS uptolike предлагает готовые плагины или модули, которые облегчают встраивание блока "расшаривания" в страницы. Такие плагины есть для:
  • Wordpress
  • Joomla
  • Drupal
  • Bitrix
А еще можно прикрутить модуль авторизации через социальные сети, который предоставлен сервисом Ulogin.

От открывающихся возможностей разбегаются глаза, но при ближайшем рассмотрении наиболее подходящими для нужд блога на платформе Blogger, мне показались виджеты "Поделиться" и "Подписаться". Возможно "Лайки" также будут вполне себе ничего для наладки интерактива с аудиторией, а блогам с преобладанием визуального контента приглянется функция "Поделиться картинкой", но смысл Рейтинга статей для меня пока ускользает. Равно как и нужность счетчика, когда более привычными и релевантными являются инструменты от Яндекса и Liveinternet.

Так вот, в чем замечательность сервиса кроме разнообразия функций, которую я только что расписал? Давайте смотреть с примерами.

Блок Поделиться от Uptolike в Blogger

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


Выберем "Поделиться". Этот виджет будет отвечать за кнопки репоста страниц блога в социальные сети.


Мы попадаем на страницу настроек. Они сгруппированы на левой панели:


1. Социальные сети для основного представления сайта. Показаны самые ходовые, менее распространенные спрятаны под голубой ссылкой, клик по ней раскрывает список. Потащив за правую часть строки списка, можно поменять местами его элементы.
2. Можно добавить адаптированное представление виджета для мобильного вида сайта.
3. И отдельно настроить список социальных сетей для него.
4. Дополнительные настройки: цитирование предложит поделиться выделенным текстом, кнопка "наверх" облегчит навигацию, многоточие с полным списком социалок можно отключить и последний чекбокс позволит оснастить сайт всплывающим окном с предложением подписаться на группу в соцсети. Обратите внимание, что две настройки влияют и на мобильный вид блока.
5. Предпросмотр обычной и мобильной версий виджета можно переключить над основным окном.


Даже свернутые, настройки не влезают целиком на один экран, поэтому продолжим:

6. Виджет может быть расположен как в виде классического блока в посте, так и в виде боковой панели на одной из сторон экрана. Мне надоело бороться с "убегающими" кусками кода в постах, поэтому я выбрал боковую панель и разместил ее слева. Установка виджета в этом случае будет чуть отличаться от классического варианта с шаблоном текста сообщения. Ее я и покажу дальше.
7. Uptolike позволяет очень гибко настраивать внешний вид блока: от размера и формы кнопок до их цвета, эффекта при наведении, цвета текста и фона. Кроме того, можно добавить счетчик репостов и подобрать его стиль.
8. Наконец, финальным шагом станет нажатие кнопки "Сгенерировать код". После этого сервис создаст необходимые скрипты и прочие элементы, которые нужно скопировать в буфер.


А затем вставить в качестве содержимого гаджета вида HTML/JavaScript.

Теперь на каждой странице нашего блога будет размещена панелька с возможностью сделать репост именно этой страницы. Размещать код дополнительно в теле поста не нужно.

Блок Подписаться от Uptolike в Blogger


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


Настроек здесь поменьше, но функциональность по-прежнему на высоте:
1. В основном блоке нужно отметить социальные сети и указать идентификаторы профилей или групп в них. Менять местами кнопки здесь возможности нет, придется сделать это позже в коде виджета.
2. К блоку можно добавить функцию цитирования и переход наверх страницы.
3. Помимо классического варианта с размещением в контенте, виджет также может быть плавающим и размещаться у края окна.
4. Настраиваем внешний вид кнопок.
5. И генерируем код.


Который вставим в очередной гаджет HTML/JavaScript. Кстати, смотрите, именно на этом этапе можно переставить социальные сети местами. Для этого нужно в разделе data-sn-ids разместить переменные в нужном порядке. 

Как это выглядит вживую можно посмотреть в моем основном блоге www.u-ned.ru.

1 комментарий:

  1. Спасибо за статью, довольно содержательная. У меня есть вопрос, по возможности ответьте пожалуйста. Как поставить кнопку поделиться для pinterest ? Для своего другого сайта я на платформе wordpress я уже нашел подходящий плагин pinterest, и с легкостью установил. Нашел также для blogger, поставил, но он не работает, вообще не отображается, поэтому и спрашиваю

    ОтветитьУдалить

Related Posts Plugin for WordPress, Blogger...