Кнопки социальных сетей на сайт

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

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

Скрипт социальных кнопок для сайта предоставляют много источников:

  1. Социальные кнопки яндекса;
  2. Плагины социальных кнопок для WordPress;
  3. Сервисы социального шаринга и дополнительных инструментов.

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

Социальные кнопки Яндекса

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

Есть возможность размещения:

  • Простых иконок;
  • Иконок со счетчиками;
  • Показывать только несколько сетей и и кнопки меню для открытия дополнительных;
  • Кнопок маленького размера.

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

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

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

Изменение стиля социальных кнопок Яндекса

Чтобы изменить внешний вид, необходимо переопределить стили Яндекса в своем CSS файле.

.b-share_theme_counter .b-share {
padding: 0 !important;
}

.b-share_theme_counter .b-share__link {
border-radius: 0px !important; /*убираем скругление иконок*/
background-color: #555 !important; /*делаем фон серым*/
}

.b-share_theme_counter .b-share__link:hover {
opacity: 0.8; /*добавляем прозрачность при наведении*/
}

.b-share_theme_counter .b-share-icon {
background-image: url('https://ваш сайт.ру/files/b-share_counter_large.png') !important;
/*заменяем стандартное изображение иконок на свое*/
}

.b-share_theme_counter .b-share-counter {
color: #fff; /*задаем цвет текста*/
}

Меняем размер иконок:

.ya-share2__container_size_m .ya-share2__icon {
height: 40px !important;
width: 40px !important;
background-size: 40px 40px !important;
}

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

Плагины социальных кнопок для WordPress

Easy Social Share Buttons

Этот премиум плагин доступен на CodeCanyon.net за $19. Это один из самых универсальных плагинов подобного рода, благодаря одному простому факту — плагин позволяет размещать бар с кнопками для социальных сетей абсолютно в любом месте, где это может вам понадобиться.

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

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

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

Monarch от Elegant Themes

Monarch — это платный плагин для социальных сетей, который поставляется с тарифными планами Elegant Theme’s Developer и Lifetime Access. Данные планы включают в себя более 85 премиум тем для WordPress и все другие плагины от этого разработчика. К сожалению, политика компании такова, что вы не можете купить отдельно сам только плагин. Вы оплачиваете полный тарифный план и получаете доступ сразу ко всем премиум плагинам и темам разработчика.

Monarch — это отзывчивый плагин, который позволит вам размещать эффектные плавающие бары по бокам поста или статические горизонтальные бары в начале/конце поста. Monarch предоставляет более 20 иконок для социальных сетей, есть image-sharing, pop-up и fly-in функции, а также множество настроек для оформления и дизайна.

Social Warfare

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

Плагин предоставляет аналитику, возможность показывать количество репостов только после того, как постом поделится определенное количество людей, также есть более 75 различных вариантов для оформления. Можно использовать плагин для добавления функции click-to-tweet в ваши посты.

Бесплатные плагины для социальных сетей

Теперь давайте перейдем к нашему списку лучших бесплатных плагинов, на которые стоит обратить внимание в 2016 году.

SumoMe Share

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

SumoMe Share Pro поставляется с дополнительными функциями. Например, здесь есть возможность удалить брендинг SumoMe из вашего бара, можно отслеживать UTM-метки, чтобы узнать, какие социальные сети приносят наибольший трафик и т.д.

GetSocial

GetSocial является бесплатным адаптивным плагином для социальных сетей. Он позволяет вам размещать плавающий бар сбоку вашего поста или статический бар сверху/снизу. В бесплатной версии вы также найдете различные варианты для оформления.

Разработчики представили и премиум версию плагина (с ежемесячной платой). В ней вы найдете функцию для добавления плавающего бара для мобильных версий и дополнительные варианты дизайна, есть функция click-to-tweet. В платной версии у вас также будет возможность убрать счетчик с кнопок, который отвечает за количество репостов.

AddToAny Share Buttons

AddToAny Share Buttons — это один из самых популярных WordPress плагинов для социальных сетей с более чем 200,000 активных установок. Этот плагин ставит простые плавающие бары по бокам вашего поста, а также в его начале или конце.

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

Custom Share Buttons with Floating Sidebar

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

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

Sharify Social Share Buttons

Это далеко не самый известный плагин, но его отзывчивый и приятный дизайн делают его одним из основных претендентов на звание лидера в нашем списке "Лучшие бесплатные плагины 2016 года". Это простой плагин с действительно отличным, аккуратным дизайном, результат работы которого будет гармонично смотреться на вашем сайте.

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

Социальные кнопки и дополнительные инструменты AddThis

Здесь бы я хотел рассмотреть очень удобный по моему мнению инструмент предоставляемый сервисом AddThis. Который предлагает для использования:

  1. Кнопки социальных сетей;
  2. Кнопки подписки в соцсетях;
  3. Похожие материалы;
  4. И многое др...

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

Сервис может работать абсолютно на любом движке и даже на HTML сайтах. Усли же вы пользуетесь WordPress, то вам доступен плагин, который упростит работу с сервисом.

В другие же движки можно подключить размещением кода на страницу в шаблоне.

А теперь по порядку:

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

Инструменты

В инструментах нам доступны

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

Социальные кнопки поделится

Социальные кнопки можно разместить на ПК с левой или с правой стороны экрана, на мобильных сверху или снизу.

По нажатию Add more Services доступны все популярные социальные сети, как зарубежные, так и наши.

Рекомендуемые статьи

Сервис предлагает и удобный инструмент для показа рекомендуемых статей посетителей.

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

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

Как я отмечал в своей статье, как ускорить сайт на WordPress , по PageSpeed Insight показатель понижения скорости от использования AddThis кода на сайте всего 1%.

Вы можете добавлять разное количество сайтов, по каждому сайту получать статистику и все это на бесплатной основе. Сервис действительно очень удобен. Сайт сервиса www.addthis.com.

Вас могут заинтересовать:



Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *