Содержание

Где расположить кнопки социальных сетей на сайте

  • 17 июля 2019
  • Продвижение
  • 10.4K
  • 6 мин.
  • Понравилось? Поделись!

    Прочесть позже

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

Помимо аккаунтов в соцсетях, следует добавить на сайт кнопки «Поделиться» (или по-другому share-кнопки, кнопки шеринга), которые позволят пользователям быстро добавить ссылку на ваш сайт у себя на странице или отправить в сообщении другу.

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

Оформление кнопок

Для начала определимся с внешним видом кнопок. Основные рекомендации:

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

    Пример незаметных кнопок:

    Компания изменила цвет, но кнопки остались заметны:

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

    Не сразу понятно, что это кнопки и что они ведут на соцсети:

    Несмотря на кардинальное изменение внешнего вида, сразу понятны функции данных кнопок:

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

    Пример изменения кнопки после наведения курсора:

  4. Кнопок не должно быть слишком много. Исследования за прошедший год показывают, что в основном россияне используют Youtube, ВКонтакте, Одноклассники, Facebook и Instagram, а также делятся информацией в WhatsApp и Viber. Обязательно учитывайте особенности аудитории вашего сайта, однако рекомендуем размещать не более 5-7 кнопок.

  5. Ссылки должны быть рабочими. Очевидный пункт, но многие не знают, что Google+ закрыла свою соцсеть и теперь ссылка доступна только для корпоративных клиентов. Также из-за прошедших блокировок соцсети Telegram у пользователей возникают проблемы с доступом.

  6. По кнопкам должно быть удобно кликать. Мелкие элементы менее заметны, поэтому можно легко промахнуться, нажав на соседнюю кнопку. Минимально допустимый размер кнопки от 10×10 мл или примерно 40×40 пикселей.

    Пример слишком мелких кнопок:

    По таким кнопкам сложно не попасть:

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

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

Uptolike — не менее хороший конструктор и обилие настроек по дизайну кнопок. Есть отдельные плагины для популярных CMS.

Блок «Поделиться» от Яндекса — если не хочется заморачиваться с оформлением, то Яндекс предлагает самый простой конструктор с минимумом возможностей. Плюс данного сервиса в том, что доступно исследование через Яндекс.Метрику.

Кнопки соцсетей для сайта: где расположить?

  1. Главная страница. После обзора товаров и услуг кратко расскажите об аккаунтах в соцсетях.

    Блок можно сделать крупным, показать последние посты.

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

    Пример более компактного блока с призывом к действию:

  2. Страница о компании. Рассказывая о себе, можно внизу страницы также добавить блок с последними постами и ссылками на соцстети.

    Или кратко упомянуть аккаунт, как здесь:

  3. Страница контактов. Если используете соцсети как один из источников связи, обязательно добавьте кнопки на данную страницу. Пример:

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

И еще 4 идеи для размещения кнопок шеринга

  1. После текста статьи, инфографики, акции, т. е. после полезного материала или информации. У пользователя должно возникнуть желание поделиться важными сведениями. Ссылки лучше выравнивать по левому краю, как в примере:

    Или пример с призывом к действию:

  2. На страницах акции. Про них, кстати, чаще всего забывают.

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

  4. На страницах услуг. Если основной продукт компании — предоставление услуг, то, как и в предыдущем пункте, следует разместить кнопки шеринга. В данном случае кнопку желательно поместить в первом экране:

    Или внизу страницы:

Где НЕ нужно располагать кнопки

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

    Например, в данном случае кнопки привлекают слишком много внимания и выглядят ярче, чем логотип:

  2. В боковом меню ссылки соцсетей также будут отображаться «слишком рано». Да и не стоит перегружать боковое меню. Антипример:

  3. Закреплять на странице. Данную функцию полезно использовать для онлайн-консультанта или формы обратной связи, а кнопки соцсетей будут только отвлекать внимание пользователя.

Для кнопок репостов в соцсети можно выделить следующие ошибки:

  1. Размещение без привязки к контенту. Иногда кнопки располагают так, что не ясно, чем конкретно предлагают поделиться пользователю. Всем сайтом? Такие кнопки выглядят странно:

  2. Расположение рядом с контентом, который не интересен.

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

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

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

Выводы

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

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

P. S. Посмотрите наш крутой кейс по работе с SMM.

# ошибки юзабилити # соцсети # фишки для сайта

© 1PS.RU, при полном или частичном копировании материала ссылка на первоисточник обязательна.

Понравилась статья?

Сожалеем, что не оправдали ваши ожидания ((
Возможно, вам понравятся другие статьи блога.

8 чел. оценили, средняя оценка 5

33 бесплатных инструмента
для интернет-маркетолога

  • Сервисы для контекста
  • Сервисы для контент-маркетинга
  • Сервисы для SMM
  • Анализ конкурентов
  • Email рассыльщики
  • Работа с репутацией

Получить список бесплатных сервисов

Комментарии для сайта Cackle

Популярные статьи

  • 115.7K
  • 5 мин.

Хитрости написания title и description#мета-теги#оптимизация сайта#контентное продвижениеПравильно составленные теги Title и Description – одна из важных составляющих на пути к успеху в продвижении.

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

  • 24.3K
  • 11 мин.

Cайты-агрегаторы: как попасть в ТОП с их помощью#продвижение сайтаСайты-агрегаторы – настоящие «монстры» выдачи, они в топе любой популярной ниши, и на это есть серьезные причины. Что это за сайты, почему так хорошо продвигаются и что делать, если в ваш сегмент бизнеса пролез такой ужасный «монстр» – поговорим в статье.

  • 27.4K
  • 12 мин.

Coca-cola vs. Pepsi, BMW vs. Audi: войны брендов, или «мое кунг-фу круче, чем твое»#маркетинг#методы продвиженияВеликое противостояние брендов уже вошло в историю: Burger King беспощадно троллит McDonalds уже не первый десяток лет, Pepsi пытается обойти Coca-Cola, в догоняшки играют BMW и Audi. Наблюдать за этими сражениями весело, ибо бренды на то и бренды, чтобы делать рекламу качественно. Но задумывались ли вы вообще, зачем эта война брендам? Собственно, об этом чуть-чуть и расскажем.

Все популярные статьи »

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

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

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

  • Блок поделиться от Яндекса;
  • использование сторонних сервисов для добавления кнопок;
  • плагины поделиться в социальных сетях для сайта на WordPress;
  • описание добавления кнопок каждой социальной сети по отдельности;
  • добавление иконок на профили в социальных сетях.

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

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

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

  • Яндекс кнопки соц сетей
  • Сторонние сервисы для добавления кнопок поделиться в социальных сетях
  • Плагины поделиться в социальных сетях для сайта на WordPress
  • Модуль «Поделиться» от плагина Jetpack.
  • Добавление каждой кнопки соц сети по отдельности
  • Добавление иконок на профили и группы в социальных сетях на сайт
  • Куда добавлять код кнопок поделиться на сайт

Яндекс кнопки соц сетей

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

  1. Используем Конструктор блока «Поделиться» для выбора требуемых соц сетей.
  2. Выбираем «Внешний вид блока».
  3. Копируем код и вставляем в нужном месте на сайт.

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

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

Подбираем внешний вид, кнопки со счетчиком или без, маленькие или крупные и копируем код для вставки на сайт:

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

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

Не буду проводить обзор всех возможных сервисов, их суть одна и та же:

  1. Выбираете соц сети.
  2. Изменяете внешний вид.
  3. Копируете код.
  4. Вставляете у себя на сайт.

Теперь список сервисов:

  • http://share.pluso.ru/
  • http://share42.com/ru
  • https://uptolike.com/
  • http://social-likes.js.org/ru/

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

Не буду долго описывать, незачем, все интуитивно понятно.

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

Как установить кнопки соц сетей на сайт WordPress

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

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

Для данного случая мы выбрали два удобных плагина, которые именуются как Social Share Buttons и Jetpack.

Модуль «Поделиться» от плагина Jetpack.

Первым более продвинутым плагином для добавления кнопок социальных сетей на ваш сайт WordPress является Jetpack.

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

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

Заходим в административную панель, далее Jetpack/Настройки. И выбираем группу модулей «Социальные».

Далее находим нужный нам модуль «Поделиться» и переходим по его ссылке.

Затем нажимаем «Настроить» и нас перекидывает в меню настроек социальных сетей.

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

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

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

В следующем меню мы настраиваем стиль кнопки и места их вывода на нашем сайте.

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

Установка кнопок социальных сетей на сайт WordPress. Настройки Social Share Buttons.

Итак, не будем ходить вокруг да около, а перейдем сразу же к установке кнопок социальных сетей. Заходим с админки в меню настройки и добавления плагинов. Через поиск находим предложенный нами Social Share Buttons for WordPress.

Установив и активировав плагин для добавления иконок социальных сетей, заходим в появившееся новое меню с консоли нашего WordPress — Share Buttons.

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

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

Что мы можем тут настроить?

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

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

Share настройки, выбор стиля кнопок для социальных сетей.

  1. Выбираем понравившиеся стиль и сортируем на свое усмотрение наши иконки.
  2. Настраиваем с какими именно соц. сетями вы хотите взаимодействовать и где соответственно продвигать свой продукт.
  3. Настройка отступов между иконками.

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

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

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

Добавление каждой кнопки соц сети по отдельности

Кнопка поделиться Вконтакте

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

Вы сможете выбрать стиль кнопки, текст, вариант лого, и даже написать самостоятельно текст для кнопки.

Кнопка поделиться Facebook

По аналогии с предыдущим примером даю ссылку для получения кнопки и привожу скриншот настроек:

Настройки не сложные, но написано на более профессиональном уровне. Главное подберите стиль и скопируйте код для вставки на сайт.

Кнопка поделиться Одноклассники

Все аналогично, переходим на сайт, подбираем кнопку, копируем код.

Кнопка поделиться Google+

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

Кнопка поделиться от Твиттер

Твиттер так же предоставляет широкие настройки для кнопок. Ссылка тут, скрин ниже:

Кнопка поделиться от Mail.ru

Не многие используют, но может пригодиться и кнопка от мейл ру.

Похоже на Однокласники, с чего бы это 😆 .

Добавление иконок на профили и группы в социальных сетях на сайт

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

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

Итак, что нам нужно:

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

Первым делом покажу небольшой код, для 2-х соц сетей, VK и G+, а так же иконку ленты FeedBurner. По аналогии вы можете добавить сколько угодно иконок.

<div>   <a href="http://feeds.feedburner.com/yrokiwp">     <img title="Подписка RSS"       alt="Подписка RSS" src="//feedburner.google.com/fb/images/pub/feed-icon32x32.png"/></a> </div> <div>   <a href="https://vk.com/yrokiwpru">     <img title="Группа Вконтакте"       alt="Группа Вконтакте" src="<?php bloginfo('template_url') ?>/images/vk.png"/></a> </div> <div>   <a href="https://plus.google.com/u/0/communities/112307833797572900957">     <img title="Сообщество G+"       alt="Сообщество G+" src="//yrokiwp.ru/wp-content/themes/first_2015/images/gplus.png"/></a> </div>

В этом примере я показал сразу три варианта добавления иконок, первый с использованием картинок с другого сайта, второй WordPress-совский используя функцию bloginfo(), третий, более правильный и оптимальный, указание абсолютного пути к картинке на сервере.

Что касается CSS, тут я вам навряд сильно помогу, могу лишь дать несколько советов по примеру ниже:

.head-icon{ float:right; /*или left*/ margin:5px;} /*отступы по всем сторонам*/

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

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

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

Покажу на примере WordPress, вам нужно найти в каком месте закрывается блок с основным контентом, как можно увидеть на картинке ниже он вмещает в себя, заголовок страницы, непосредственно контент, у вас может быть еще что-то, все зависит от темы. Суть в том чтобы вставить код кнопок поделиться непосредственно в том месте где заканчивается текст. Это должно выглядеть примерно так:

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

Рекомендую почитать:

  • Плагин подписки на блог и комментарии;
  • Где получить бесплатные индексируемые ссылки?
  • Нужные плагины WordPress;
  • Публикация с помощью электронной почты;
  • Обратная связь на сайте.

Кнопки социальных сетей «Поделиться» и «Мне нравится»

Содержание:

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

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

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

Официальные

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

1.Вы открываете страницу конструктора.


2.Настраиваете внешний вид и функционал кнопки.


3.Копируете предоставленный код и встраиваете его в код своей страницы.


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

  1. «Одноклассники»: кнопка «Класс»
  2. «Одноклассники»: виджет группы
  3. Виджеты и кнопки «ВКонтакте»
  4. Кнопка подписки на канал YouTube
  5. Кнопки Twitter

У такого метода добавления кнопок есть одно существенное преимущество и один существенный недостаток.

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

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

Всех этих качеств лишена следующая группа инструментов.

«Всё в одном»

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

Сервисов таких есть много, я же в качестве примера расскажу о трёх.

Кнопки от Share24.com


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

Кнопки от PLUSO


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

Кнопки от Яндекса


Как всегда, простой в использовании, приятный на вид, довольно функциональный и выдающий превосходный лаконичный код инструмент от известной отечественной компании. Кстати, факт того, что сервис реализует «Яндекс», даёт почти такую же уверенность в «вечной», бесперебойной и честной работе кнопок, как и официальные инструменты.

Другие

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

Плагины для популярных CMS

Они подойдут владельцам только тех ресурсов, которые работают на популярных CMS, таких как WordPress, Drupal или Joomla, так как плагины под распространённые «движки» уже есть, а разработка аналогов для самописных систем вряд ли имеет смысл — проще поставить уже готовый набор кнопок, воспользовавшись инструментарием предыдущей категории.

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

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

Принцип работы с плагинами проиллюстрирую на примере написанного под WordPress расширения Easy Social Share Buttons.

1.Дополнение скачивается и устанавливаться.

2.Плагин активируется и настраивается.


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

Заключение

Как видите, интегрировать свой сайт с социальными сетями, добавив соответствующий функционал, очень и очень просто, причём существует множество удобных способов реализации на любой вкус, так что если ваш веб-ресурс до сих пор находится «в вакууме» и не позволяет посетителю «поделиться», «твитнуть» или «оставить коммент» — задумайтесь, а не теряете ли вы новых пользователей и их активность на сайте? Может, потраченный на установку социальных кнопок час сэкономит вам дни, которые вы потратите на другие методы привлечения трафика и продвижения сайта?

Как и где их добавить

Хотите получать больше трафика из социальных сетей?

Согласно исследованию Alexa, на социальные сети приходится от 0,8% до 12,2% трафика веб-сайта, при этом новостные и информационные сайты получают наибольшее количество трафика из социальных сетей.

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

В этой статье мы покажем вам, как добавить кнопки социальных сетей на ваш веб-сайт, чтобы увеличить трафик социальных сетей на ваш веб-сайт.

Где следует использовать кнопки социальных сетей

Каким контентом на вашем веб-сайте чаще всего делятся?

Скорее всего, если у вас есть блог, это будет контент вашего блога.

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

Исключением, согласно некоторым исследованиям, являются страницы с конкретным призывом к действию.

По данным VWO, клики по основной кнопке призыва к действию (добавить в корзину) увеличились на 11,9%, когда кнопки социальных сетей были удалены с целевой страницы.

Лучший подход при внесении изменений на ваш веб-сайт — это A/B-тестирование.

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

Как популярные публикации используют кнопки социальных сетей

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

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

Скриншот с сайта Billboard.com, декабрь 2021 г.

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

В идеале посетители не решат поделиться статьей, пока не прочитают ее.

Предприниматель решает эту проблему с помощью кнопок социальных сетей.

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

Скриншот с сайта Entrepreneur. com, декабрь 2021 г.

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

Yahoo Sports предлагает аналогичную функцию на своем веб-сайте.

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

Скриншот с сайта Yahoo.com, декабрь 2021 г.

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

Harvard Business Review предлагает кнопки социальных сетей в верхней части статьи, а также в нижней части статьи, под указанием автора.

Скриншот с сайта HBR.org, декабрь 2021 г.

К сожалению, эти кнопки социальных сетей будут недоступны для тех, кто не дочитал статью до конца.

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

Скриншот с сайта CNET.com, декабрь 2021 г.

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

Это означает, что многие посетители могут даже не заметить эти кнопки.

Пользователи платформы Medium получают кнопки социальных сетей вверху и внизу своих сообщений.

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

Скриншот с сайта TowardsDataScience.com, декабрь 2021 г.

При таком подходе вы можете получать публикации в начале и в конце публикации, а также настраиваемые твиты повсюду.

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

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

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

Большинство ведущих социальных сетей предлагают свои собственные официальные кнопки социальных сетей.

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

Скриншот с сайта Twitter.com, декабрь 2021 г.

Meta for Developers предлагает конфигуратор кнопки «Поделиться» в Facebook.

Позволяет выбирать различные стили кнопки «Поделиться в Facebook», включая счетчик в виде поля, счетчик с кнопкой или без счетчика.

Скриншот с Facebook.com, декабрь 2021 г.

Pinterest предлагает конструктор виджетов, аналогичный Twitter и Facebook, поэтому владельцы веб-сайтов могут создавать кнопки «Закрепить» и «Сохранить» для контента своего веб-сайта.

Скриншот с Pinterest.com, декабрь 2021 г.

Плагины и приложения для обмена в социальных сетях

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

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

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

Большинство работает на нескольких платформах, помимо WordPress.

1. ShareThis

ShareThis — это бесплатный сервис, который позволяет вам добавлять кнопки социальных сетей на ваш сайт WordPress или Shopify.

Они предлагают как встроенные кнопки социальных сетей, так и кнопки социальных сетей, которые плавают рядом с вашим контентом.

2. AddThis

AddThis — еще одна социальная служба обмена, позволяющая добавлять кнопки на веб-сайты на нескольких популярных платформах, включая WordPress, Shopify, Tumblr и Blogger.

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

3. AddToAny

Кнопки социальных сетей AddToAny также работают на различных платформах веб-сайтов, включая WordPress, Tumblr, Drupal и Joomla. AddToAny предлагает несколько вариантов размещения, как и другие плагины выше.

4. Shareaholic

Shareaholic позволяет добавлять встроенные и плавающие кнопки социальных сетей на ваш веб-сайт. Он работает с WordPress, Drupal, Tumblr и на любом веб-сайте, куда вы можете встроить код.

5. ElfSight

ElfSight — это премиальный плагин кнопок социальных сетей, который предлагает отзывчивые кнопки социальных сетей с настраиваемыми дизайнами и макетами.

Он работает на большинстве платформ веб-сайтов, включая WordPress, Shopify, Wix, Weebly и многие другие.

Заключение

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

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

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

Обязательно проведите A/B-тестирование различных мест размещения и отслеживайте изменения в своем трафике в социальных сетях.

Дополнительные ресурсы:

  • 3 совета, как увеличить время, которое люди тратят на чтение вашего контента
  • Как повысить охват и вовлеченность вашего контента
  • KPI контент-маркетинга: руководство по выбору правильных KPI для контента

Рекомендуемое изображение: vladwel/Shutterstock

Категория Содержание Социальные сети

Бесплатные кнопки и плагины для публикации в социальных сетях для веб-сайтов и блогов

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

Активировать сейчас

  • Бесплатно
  • Простота установки
  • Быстрая настройка

Присоединяйтесь к миллионам создателей контента по всему миру

Что нового:

Smart Share Buttons

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

Кнопки Smart Share определяют геолокацию посетителя вашего веб-сайта и автоматически настраивают каналы на основе самых популярных сервисов обмена в их регионе. Зарегистрируйтесь или войдите на нашу платформу, чтобы привлечь больше внимания к своему контенту или продуктам.

Наши кнопки «Поделиться»

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

Начало работы

Кнопки Sticky Share

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

Начало работы

Кнопки обмена изображениями

Позвольте вашей аудитории поделиться вашим самым мощным визуальным контентом

Начатие

Кнопки обмена видео

Добро пожало Начато

Бесплатно для использования

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

Настраиваемый

Адаптируйте дизайн, включая выравнивание, размер и цвет, чтобы он соответствовал вашему бренду

Оптимизировано для мобильных устройств

Потрясающе выглядит и работает на любом экране, большом или маленьком

Многоязычная поддержка

Выберите предпочитаемый язык из более чем 15 вариантов

Плагин WordPress

Полная интеграция с вашей любимой веб-платформой Аналитика

Простая и удобоваримая информация о том, что находит отклик у вашей аудитории

  1. Выберите тип кнопок
    Выберите подходящий инструмент(ы) для увеличения посещаемости вашего сайта
  2. Настройте дизайн
    Выберите социальные сети и настройте кнопки в соответствии с вашим брендом
  3. Добавьте код на свой сайт
    Вставьте свой уникальный код ShareThis в шапку вашего сайта
  4. Скопируйте и вставьте место размещения код
    Добавьте код размещения везде, где вы хотите, чтобы инструмент отображался

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

Показать все кнопки

Часто задаваемые вопросы

Есть вопросы о наших продуктах и ​​услугах? Не смотрите дальше!

Кнопки ShareThis Share бесплатны?

Да! С 2007 года мы предоставляем бесплатные кнопки «Поделиться», которые позволяют делиться контентом в открытом Интернете.

Как получить код HTML/кнопки «Поделиться» для кнопки «Поделиться»?

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

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

Подробнее о том, как установить кнопки «Поделиться» на веб-сайте в формате HTML, см. в этом сообщении службы поддержки.

Как установить кнопки «Поделиться» на моем сайте WordPress?

Кнопки «Поделиться» ShareThis для WordPress дают вам больше контроля над тем, где и как кнопки «Поделиться» появляются на вашем сайте. Более того, нет необходимости копировать и вставлять код, так как все управляется через нашу платформу и настройки плагина. Загрузка и установка нашего плагина на ваш сайт WordPress занимает менее пяти минут. Посмотрите руководство по установке и попробуйте сегодня!

Как установить кнопки «Поделиться» на моем сайте WIX?

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

Затем выберите нужные кнопки общего доступа. Вы можете настроить свой дизайн, выбрав выравнивание, размер кнопки, призыв к действию и количество репостов. Когда ваша кнопка будет готова, нажмите «зарегистрироваться и получить код», чтобы получить код кнопки. После создания кнопок «Поделиться» вы можете нажать кнопку «Зарегистрироваться и получить код», чтобы получить код кнопки «Поделиться». Скопируйте код в разделе «Установите sharethis.js на своем веб-сайте». Затем войдите в свою учетную запись Wix, чтобы ввести HTML-код в текстовое поле.

Прочтите этот пост поддержки, чтобы узнать больше о том, как установить кнопки «Поделиться» на Wix.

Как установить кнопки «Поделиться» на моем сайте Weebly?

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

Затем выберите нужные кнопки общего доступа. После создания кнопок «Поделиться» вы можете нажать кнопку «Зарегистрироваться и получить код», чтобы получить код кнопки «Поделиться». Когда ваша кнопка будет готова, нажмите «зарегистрироваться и получить код», чтобы получить код кнопки. После создания кнопок «Поделиться» вы можете нажать кнопку «Зарегистрироваться и получить код», чтобы получить код кнопки «Поделиться». Скопируйте код в разделе «Установите sharethis.js на своем веб-сайте». Затем войдите в свою учетную запись Weebly, чтобы ввести HTML-код в текстовое поле.

Как создать настраиваемые кнопки «Поделиться»

Предпочитаете настраивать кнопки «Поделиться»? Большой! Наш общий код позволяет создавать собственные кнопки с нуля. Мы позаботимся об обмене и подсчете для вас.

Прочтите этот пост поддержки, чтобы узнать больше о том, как создавать собственные кнопки ShareThis Share.

Почему Instagram недоступен в качестве кнопки «Поделиться»?

В настоящее время некоторые платформы социальных сетей (такие как Instagram или Tik Tok) ограничивают свой API, поэтому невозможно обмениваться контентом через конечную точку через приложение за пределами их среды. Тем не менее, мы предлагаем кнопку «Подписаться» в Instagram, кнопку «Подписаться на Tik Tok» (и многое другое!), которую вы можете добавить, включив кнопки «Подписаться».

Средний рейтинг пользователей


पटीर

जगदीश

2018-11-09

Awesome Tool

Это помогло мне сделать вещи действительно быстро

2018-11-15

.

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

01.07.2019

Отличный инструмент

Лучший сервис, отличный инструмент, он сделал мою работу такой легкой.

03.09.2019

Партнер по маркетингу

Мне Sharethis — один из моих новых любимых онлайн-инструментов. Никогда еще создание кнопок «Поделиться» для ваших блогов, целевых страниц и веб-сайтов не было таким простым! Я на 100% рекомендую всем, кто хочет, чтобы их соединение было доступно в Интернете. И даже лучше, что это совершенно бесплатно прямо сейчас. 😍

29.11.2019

Потрясающий инструмент

17. 07.2020

Полезное приложение

Действительно, я имел в виду

27.07.2020

Лучший инструмент на земле!

Я перепробовал множество инструментов обмена от многих разработчиков, но, честно говоря, ShareThis намного лучше и работает безупречно. 1. Кнопки выглядят великолепно, просто и понятно, мы можем их настроить. И есть вариант ширины 100%, чтобы сделать его отзывчивым на любом размере экрана. 2. Если вы измените параметры/настройки кнопки в своей учетной записи, кнопка на вашем веб-сайте автоматически обновится. 3. Кнопки не блокируются Adblock, что увеличивает видимость вашего сайта. Спасибо, поделитесь этим

2020-10-02

Лучший инструмент на земле!

Имя:Название:Оценка:

Написать отзыв:

Наши плагины и приложения CMS упрощают интеграцию наших инструментов с вашим сайтом.

WordPress

Установка

Shopify

Установка

Adobe Commerce

Установка

Cloudflare

Установка

ReactJS

Установка

AngularJS

Установка

GAT

ANGULA0133

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

Активировать сейчас

Как добавить кнопки общего доступа в социальных сетях на ваш веб-сайт

Кнопки общего доступа в социальных сетях — это кнопки для различных платформ социальных сетей, таких как Facebook, Instagram, и Twitter, которые вы добавляете на свой веб-сайт, чтобы люди могли поделиться вашей страницей в своей соответствующей учетной записи в социальной сети. По сути, это ссылки в социальных сетях, которые приводят к увеличению трафика вашего веб-сайта, поскольку, надеюсь, вы можете привлечь больше клиентов, когда люди будут делиться вашим контентом.

По сути, кнопки социальных сетей позволяют читателю легко делиться вашим контентом на своих платформах социальных сетей. Ключевая задача кнопок — облегчить акт обмена. Если бы читателю было тяжело поделиться вашим контентом, который ему понравился, он, скорее всего, не поделился бы им. Поэтому кнопки «Поделиться» в социальных сетях — отличная возможность добавить на свой сайт.

Существует три разных типа кнопок социальных сетей. Это: 

  • Кнопка общего доступа  

В этой статье основное внимание будет уделено кнопкам «Поделиться» в социальных сетях, которые следует добавить на ваш веб-сайт, чтобы поделиться своими продуктами или статьями с остальным миром.

  • Кнопка следования  

Кнопки отслеживания в социальных сетях также являются отличной функцией для добавления на ваш веб-сайт. Это позволяет читателю легко следить за вами в социальных сетях.

  • Кнопка «Нравится»   

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

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

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

Например, когда посетитель вашего веб-сайта приобрел товар, вы можете добавить кнопку «Поделиться» рядом с подтверждением его заказа. Таким образом, они могут поделиться тем, что они купили, на своих платформах в социальных сетях или даже со своими друзьями и семьей. Это увеличивает ваш онлайн-охват, что только положительно.

Давайте приступим к добавлению кнопок обмена в социальных сетях на ваш сайт.

В WordPress есть различные плагины, которые вы можете использовать. Ниже я поделюсь несколькими примерами различных плагинов, которые можно легко установить.

  • Кнопки «Поделиться» от AddThis. У этого плагина более нескольких сотен тысяч пользователей и хороший рейтинг.
  • Shareaholic. У этого плагина более нескольких сотен тысяч пользователей и хороший рейтинг.
  • Реактивный ранец. Jetpack — это плагин с множеством функций, в том числе позволяющий добавлять кнопки на ваш сайт.
  • Компаньон Орбит Фокс. Этот плагин имеет более 20 кнопок обмена в социальных сетях, которые вы можете выбрать.
  • Социальная вилка. Бесплатный плагин, который позволит вам настроить ваши кнопки.

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

Чтобы лучше понять процесс установки плагина, мы опишем и проиллюстрируем шаги. В этом примере мы выберем кнопки «Поделиться» плагина AddThis.

  1. Установить   
  • Войдите в свою панель управления WordPress.
  • Перейдите в меню навигации.
  • Выберите плагины и найдите «Поделиться кнопками от Addthis».
  • Установите плагин и нажмите «Активировать».
  1. Регистрация  

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

  1. Добавить это
  • После того, как вы вошли в систему, вернитесь к панели навигации панели управления и щелкните только что установленный плагин Addthis.
  • Щелкните вкладку «Кнопка общего доступа» на вкладке «Добавить это».
  • Оказавшись там, нажмите «Добавить новый» и выберите, какой стиль кнопок общего доступа вы хотите активировать. Вы можете выбрать между боковой панелью и встроенной. С боковой панелью ваши кнопки плавают на вашем веб-сайте и будут следовать за вашими пользователями, когда они прокручивают вашу страницу, тогда как встроенные могут быть где угодно на странице, вверху, внизу — на ваше усмотрение.
  1. Выбрать

После выбора стиля, который вы хотите использовать на своем веб-сайте, выберите тип настроек, которые вы хотите использовать. Например, выберите между различными типами платформ социальных сетей, которые вы хотите включить, положением кнопок «Поделиться» на рабочем столе и мобильном телефоне, стилем и т.