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

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

Оглавление

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Как это работает

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

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

Используйте конфигуратор кнопок share от Facebook для создания кода кнопки share, который можно вставить в HTML вашего сайта.

Опции кнопки поделиться с Facebook

Когда вы размещаете на своем сайте кнопку Facebook share, вы можете выбрать, показывать ли количество раз, когда страницей уже поделились (как мы сделали в кнопке выше). Если ваша страница получает много социальных акций, это число может стать отличным социальным доказательством ценности вашего контента.

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

Как это работает

Кнопка follow позволяет пользователям подписаться на публичные обновления соответствующей страницы Facebook.

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

Используйте интерфейс кнопки следования Facebook для создания кода, который можно скопировать и вставить в HTML.

Опции кнопки следования Facebook

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

Кнопка Facebook Like

Как это работает

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

Как добавить кнопку Facebook Like

Зайдите в конфигуратор кнопки Like от Facebook, чтобы создать код для копирования и вставки в HTML.

Опции кнопки Facebook Like

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

Еще одна интересная опция: вы можете выбрать, чтобы на кнопке было написано "Рекомендовать", а не "Нравится".

Кнопка "Сохранить в Facebook

Как это работает

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

Как добавить кнопку Сохранить в Facebook

Используйте конфигуратор кнопки Save от Facebook, чтобы создать код для вставки в HTML.

Кнопка отправки Facebook

Как это работает

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

Как добавить кнопку отправки в Facebook

Вы угадали - в Facebook есть конфигуратор кнопки отправки, который предоставит вам код, необходимый для вставки в HTML.

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

Instagram не предлагает кнопки Share или Like - что вполне логично, поскольку природа Instagram как мобильной платформы для обмена фотографиями и видео означает, что она не очень подходит для того, чтобы ставить лайки и делиться веб-контентом.

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

Это означает, что у вас осталось очень мало вариантов кнопок социального обмена для Instagram. Но есть одно обходное решение, и оно простое: встроить сообщение Instagram.

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

A post shared by SMMExpert (@hootsuite)

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

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

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

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

LinkedIn предлагает индивидуальный код JavaScript для кнопок "поделиться" и "следовать".

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

Как это работает

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

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

Перейдите к генератору плагина LinkedIn share, чтобы создать код JavaScript, который можно вставить в HTML.

Опции кнопки поделиться в LinkedIn

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

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

Как это работает

Нажав на кнопку LinkedIn follow, пользователи могут следить за вашей компанией в LinkedIn, не покидая вашего сайта.

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

Используйте генератор плагина LinkedIn follow company для создания кода для вставки в HTML.

Опции кнопки следования LinkedIn

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

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

Вы можете создать свой собственный с помощью плагина-генератора профиля компании LinkedIn.

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

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

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

Как это работает

Когда пользователь нажимает на кнопку Tweet, открывается всплывающее окно с Tweet, содержащим заголовок страницы и ее URL - или вы можете задать пользовательский URL. Пользовательский URL позволяет включить UTM-параметры для отслеживания трафика, полученного от вашей кнопки "Поделиться в Twitter". Пользователь может добавить дополнительный текст по желанию перед отправкой Tweet.

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

1. Перейдите на сайт publish.twitter.com, прокрутите страницу вниз и нажмите на кнопку Кнопки Twitter
2. Нажмите Кнопка "Поделиться
3. Над полем для кода нажмите на установка параметров настройки
4. Введите свои предпочтения для параметров Tweet и размера кнопки, затем нажмите кнопку Обновление
5. Скопируйте и вставьте предоставленный код в свой HTML

Опции кнопки поделиться в Twitter

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

Кнопка подписки на Twitter

Как это работает

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

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

1. Перейдите на сайт publish.twitter.com, прокрутите страницу вниз и нажмите на кнопку Кнопки Twitter
2. Нажмите Кнопка следования
3. Введите свой адрес в Twitter, включая символ @ (например, @SMMExpert).
4. Нажмите Предварительный просмотр
5. Над полем для кода нажмите на установка параметров настройки
6. Введите свои предпочтения для параметров Tweet и размера кнопки, затем нажмите кнопку Обновление
7. Скопируйте и вставьте предоставленный код в свой HTML

Опции кнопки следования в Twitter

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

Кнопка упоминания в Twitter

Как это работает

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

Как добавить кнопку упоминания в Twitter

1. Перейдите на сайт publish.twitter.com, прокрутите страницу вниз и нажмите на кнопку Кнопки Twitter
2. Нажмите Кнопка упоминания
3. Введите свой адрес в Twitter, включая символ @ (например, @SMMExpert).
4. Нажмите Предварительный просмотр
5. Над полем для кода нажмите на установка параметров настройки
6. Введите свои предпочтения для параметров Tweet и размера кнопки, затем нажмите кнопку Обновление
7. Скопируйте и вставьте предоставленный код в свой HTML

Опции кнопки упоминания в Twitter

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

Кнопка хэштега Twitter

Как это работает

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

Как добавить кнопку хэштега в Twitter

1. Перейдите на сайт publish.twitter.com, прокрутите страницу вниз и нажмите на кнопку Кнопки Twitter
2. Нажмите Кнопка хэштега
3. Введите выбранный вами хэштег, включая символ # (например, #HootChat).
4. Нажмите Предварительный просмотр
5. Над полем для кода нажмите на установка параметров настройки
6. Введите свои предпочтения для параметров Tweet и размера кнопки, затем нажмите кнопку Обновление
7. Скопируйте и вставьте предоставленный код в свой HTML

Опции кнопки хэштега Twitter

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

Кнопка сообщения в Twitter

Как это работает

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

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

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

1. Войдите в свою учетную запись Twitter
2. В левой колонке нажмите на Конфиденциальность и безопасность
3. Прокрутите вниз до пункта Прямое сообщение и установите флажок напротив пункта Получайте прямые сообщения от кого угодно
4. В левом столбце нажмите на Ваши данные Twitter. Для доступа к этому экрану вам может потребоваться ввести пароль
5. Выберите и скопируйте свой идентификатор пользователя, который отображается под вашим именем пользователя
6. Перейдите на сайт publish.twitter.com, прокрутите страницу вниз и нажмите на кнопку Кнопки Twitter
7. Нажмите Кнопка сообщения
8. Введите свое имя пользователя в верхнем поле, включая символ @ (например, @SMMExpert).
9. Вставьте свой идентификатор пользователя в нижнее поле
10. Нажмите Предварительный просмотр
11. Над полем для кода нажмите на установка параметров настройки
12. Введите свои предпочтения для параметров Tweet и размера кнопки, затем нажмите кнопку Обновление
13. Скопируйте и вставьте предоставленный код в свой HTML

Параметры кнопки сообщения в Twitter

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

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

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

Кнопка подписки на YouTube

Как это работает

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

Как добавить кнопку подписки на YouTube

Используйте страницу YouTube configure a button для создания кода, который нужно вставить в HTML.

Варианты кнопки подписки на YouTube

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

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

Кнопка сохранения Pinterest

Как это работает

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

1. Наведение изображения : Вместо размещения отдельной кнопки Pinterest на вашем сайте, этот вариант создает код, который вызывает кнопку Pin It, когда кто-то наводит курсор мыши на любое изображение на вашей странице. Это вариант, наиболее рекомендуемый Pinterest.
2. Любое изображение : С помощью этой опции вы размещаете на своей веб-странице кнопку Pinterest, нажав на которую пользователь может сохранить любое изображение с вашего сайта на своей доске Pinterest.
3. Одно изображение : В этом случае кнопка сохранения применяется только к одному изображению на вашей странице. Это самый сложный вариант с точки зрения кодирования.

Как добавить кнопку сохранения Pinterest - наведение изображения или любой стиль изображения

1. Перейдите в конструктор виджетов Pinterest и нажмите кнопку Кнопка сохранения
2. Выберите, какой тип кнопки вы хотите использовать: наведение изображения или любое изображение
3. Выберите предпочтительные варианты размера и формы пуговицы
4. Наведите курсор мыши на изображение образца для предварительного просмотра вашей кнопки
5. Скопируйте код кнопки и вставьте его в свой HTML
6. Для опции любого изображения скопируйте и вставьте скрипт pinit.js из нижней части страницы создания виджетов в HTML, прямо над тегом

Как добавить кнопку сохранения Pinterest - один стиль изображения

1. Перейдите в конструктор виджетов Pinterest и нажмите кнопку Кнопка сохранения
2. Выберите предпочтительные варианты размера и формы пуговицы
3. В новом окне браузера перейдите на страницу вашего сайта, где находится изображение, с которым вы хотите работать
4. Скопируйте и вставьте URL этой веб-страницы в поле URL в конструкторе виджетов
5. На веб-странице щелкните правой кнопкой мыши изображение, с которым вы хотите работать, и выберите Скопируйте URL-адрес изображения
6. Вставьте URL-адрес изображения в Изображение поле в конструкторе виджетов
7. Введите описание для вашего изображения в поле Описание Это поле появится под вашим изображением, когда кто-то сохранит его в Pinterest.
8. Нажмите на образец Pin It кнопку в конструкторе виджетов для тестирования вашей кнопки
9. Скопируйте код кнопки и вставьте его в свой HTML
10. Скопируйте и вставьте скрипт pinit.js из нижней части страницы конструктора виджетов в HTML, прямо над тегом

Параметры кнопки сохранения Pinterest

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

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

SMMExpert

Как это работает

Когда кто-то нажимает на кнопку Pinterest follow на вашем сайте, появляется окно предварительного просмотра, в котором отображаются ваши последние пины. Затем они нажимают кнопку Follow в этом окне предварительного просмотра, чтобы начать следить за вашим аккаунтом Pinterest.

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

1. Перейдите в конструктор виджетов Pinterest и нажмите кнопку Следуйте за
2. Введите URL-адрес своего профиля Pinterest
3. Введите название вашего предприятия, чтобы оно отображалось на кнопке
4. Скопируйте код кнопки и вставьте его в свой HTML
5. Скопируйте и вставьте скрипт pinit.js из нижней части страницы конструктора виджетов в HTML, прямо над тегом

Варианты кнопки следования Pinterest

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

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

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

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

Как это работает

Когда пользователь нажимает на кнопку SMMExpert на вашем сайте, открывается окно с интерфейсом, содержащим ссылку на ваш контент. Пользователь может выбрать, в какие социальные сети поделиться им: Twitter, Facebook, LinkedIn, Google+ или все вышеперечисленные. Он может добавить личное сообщение перед тем, как поделиться, и решить, опубликовать ли пост сразу, запланировать его на определенное время в будущем или использоватьФункция автопланирования в SMMExpert.

Как добавить кнопку обмена информацией SMMExpert

Зайдите на hootsuite.com/social-share, введите свой URL, скопируйте и вставьте код в HTML.

Опции кнопки акции SMMExpert

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

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

Приступить к работе