Хотите уводить клиентов с сайта в переписку с вашей компанией в WhatsApp, Viber, Facebook, других соцсетях и мессенджерах? Отлично, вы по адресу. В этой статье мы разберем множество разных способов установить кнопки соцсетей и мессенджеров на сайт: напрямую в код, через конструкторы, виджеты, агрегаторы — выбирайте то, что удобнее для вас.
Для чего нужны кнопки соцсетей и мессенджеров на сайте?
Немного теории.
Кнопки помогают увеличить количество обращений: клиенту не нужно звонить или ждать ответа на сайте. Он пишет в привычный ему мессенджер и получает быстрый доступ к разговору с вашим менеджером.
А вы взамен получаете гарантированный доступ к вниманию клиента в любое время. Ведь в мессенджере он всегда на связи. Так вы можете:
увеличить количество повторных обращений, потому что диалог с компанией отображается в общем списке чатов и остается на виду,
получить новых клиентов по «рекомендации» — когда пользователь посылает ответы компании другу или в общий чат, а потом они обращаются в компанию отдельно. Это нельзя измерить точно, но такие случаи тоже исключать нельзя.
Например, это может сработать в доставке пирогов. Допустим, молодой маме нужен пирог на чаепитие в школе ребенка и она находит в поиске сайт пекарни. Видит, что можно написать в WhatsApp:
Она задает все вопросы и пересылает важную информацию в общий чат родителей. Потом если пирог всем понравится, у всех родителей уже есть ссылка на аккаунт пекарни. А главная героиня этой истории сможет так же быстро через WhatsApp заказать пирог, когда будет ждать гостей.
Плюсы и минусы иконок мессенджеров и соцсетей на сайте
Сначала рассмотрим положительные моменты:
Вы сразу же получаете контактные данные потенциальных клиентов. Их можно использовать для создания аудиторий ретаргетинга и look-alike аудиторий.
В мессенджерах вы можете запустить рассылку с акцией или спецпредложением — ее получат пользователи, которые начинали диалог с компанией.
Способов связи на сайте становится больше и пользователи могут выбирать удобный канал коммуникации, у них формируется позитивное первое впечатление от компании.
В итоге вы получаете больше обращений и продаж.
Недостаток у этого инструмента тоже есть: пользователям нужно отвечать. Культура общения в мессенджерах предполагает быстрые ответы. Лучше всего отвечать в течение нескольких минут. Как организовать этот процесс, мы расскажем дальше.
Как добавить кнопки на сайт?
Есть несколько способов — сложных и не очень.
МультиЧат
собирает в одном окне обращения с сайта, из соцсетей и мессенджеров,
убеждает посетителей сайта связаться с менеджером,
отвечает на вопросы клиентов и доводит их до заявки.
Это решение, которое приходит на ум в первую очередь. Вы сможете выбрать иконки, которые впишутся в дизайн сайта и разместить их в той части страницы, где они будут органично смотреться. Есть несколько вариантов:
В шапке сайта — это удобно, если хотя бы часть шапки фиксируется при скролле. Тогда иконки соцсетей и мессенджеров всегда будут на виду.
В подвале сайта — это тоже типичный способ расположить ссылки на мессенджеры и все остальные контактные данные. Если на сайте нет виджетов или закрепленного блока с контактами, пользователи будут искать эту информацию в подвале.
Закрепить сбоку — такой вариант используют, если в шапку сайта иконки не вписываются, но важно, чтобы ссылки на соцсети всегда были на экране пользователя.
Важно! Иконки соцсетей еще используют, чтобы посетитель мог быстро поделиться публикацией с сайта. Поэтому если будете добавлять кнопки, которые ведут пользователя в диалог с компанией, добавьте рядом с ними пояснение, например, «Напишите нам». Это поможет избежать путаницы.
Каждый из способов расположить кнопки на сайте предполагает свой вариант технической реализации. Как будет выглядеть код, который нужно добавить на сайт, чтобы встроить иконки соцсетей, заранее сказать нельзя. Это зависит еще и от технических особенностей вашего сайта.
Самое простое решение — отдать эту задачу подрядчику. Лучше тому, кто изначально занимался разработкой вашего сайта. Тогда вы можете быть уверены, что кнопки оптимизированы под мобильную версию и корректно отображаются во всех браузерах. И ничего не сломалось.
Конечно, вы можете написать код самостоятельно. Есть шаблоны и инструкции, приводим несколько в качестве примера:
Первые уроки второй части курса «Мастерская: декоративные элементы» от html-академии — пошаговая инструкция верстки кнопок социальных сетей.
Как установить кнопки через Google Tag Manager, если нет доступа к коду сайта?
Если у вас нет доступа для редактирования исходного кода, но на сайте установлен Google Tag Manager, вы можете добавить новые элементы интерфейса с помощью тега «Пользовательский HTML».
Более подробно о принципах работы этого тега вы можете прочитать в этой статье. Кроме того, в статье автор на примере разбирает, как добавить новый элемент на страницу.
Заметим только, что такое решение нельзя использовать как постоянное. Расширения для блокировки рекламы иногда блокируют и GTM, то есть часть посетителей сайта просто не увидит ни иконки соцсетей, ни другие элементы, которые вы встроили таким способом. Кроме того, чем больше элементов вы добавите в контейнер, тем ниже будет скорость загрузки вашего сайта.
Вы можете добавить новые элементы в интерфейс сайта через Google Tag Manager, чтобы протестировать гипотезу и проверить, как реагируют пользователи. Но увлекаться этим не стоит.
Использовать официальные плагины и виджеты
Некоторые соцсети предлагают готовые решения, которые позволяют направлять посетителей вашего сайта в диалог с официальной страницей компании. Такие решения есть у Facebook и ВКонтакте. Официальное решение работает только для той соцсети, которая его выпустила, подключить другие каналы коммуникации с помощью этого метода нельзя. Но вы можете добавить два виджета и общаться с клиентами в этих соцсетях.
Плагины нужно установить на сайт в соответствии с инструкцией в официальной справке соцсети.
Плагины Facebook
Эта площадка предлагает два варианта:
Плагин чата для сайта — он выглядит и работает как виджет онлайн-чата, пользователь может написать сообщение, не уходя с сайта. Но фактически переписка будет происходить в Facebook Messenger и вся история останется в нем.
Плагин «Отправить в мессенджер». В этом случае диалог с компанией открывается в новой вкладке браузера и происходит уже в интерфейсе мессенджера.
Виджеты ВКонтакте
Здесь тоже два варианта, по аналогии:
«Сообщения сообщества» — виджет, который работает как онлайн-консультант для сайта. Пример реализации вы можете найти в рекламном кабинете ВКонтакте.
«Напишите нам» — виджет, который работает как кнопка на сайте. Пользователи направляется в диалог с компанией в соцсети. Диалог также открывается в новом окне или в приложении.
Чтобы добавить на сайт официальный плагин Facebook или подключить виджет ВКонтакте, вам также понадобятся знания JavaScript и доступ в код сайта.
Ситуация меняется, если ваш сайт сделан на конструкторе. Чтобы запустить такой сайт, не нужны навыки программирования. Поэтому добавить иконки соцсетей и мессенджеров можно с помощью готовых макетов. Смотрите сами.
Как добавить кнопки мессенджеров и соцсетей на Tilda
Чтобы добавить иконки на сайт, нужно перейти в режим редактирования страницы, выбрать соответствующий блок и добавить ссылки. Вот список соцсетей и мессенджеров, иконки которых есть в конструкторе:
Вы можете изменить их цвет и размер. В некоторых типах блоков, например, в блоке SM101 можно добавить иконку и ссылку на площадку, которой изначально нет в списке, для этого нужно загрузить ее изображение: Например, так вы сможете добавить ссылку на WhatsApp:
В Tilda иконки и кнопки придется настраивать отдельно для каждой страницы.
В каких блоках Tilda предусмотрены иконки соцсетей и мессенджеров?
Шапка сайта. Для этого выбирайте блоки из категории «Меню», в некоторых блоках предусмотрены иконки соцсетей. Меню можно закрепить, тогда кнопки всегда будут на экране пользователя:
Подвал сайта. Это типичное расположение. Пользователи уже привыкли, что ссылки на соцсети и другие контактные данные можно найти в самом низу.
Раздел «Контакты». Этот блок обычно располагается на последнем экране, сюда также добавляют карту, если есть офлайн-представительство. Также вы можете сделать отдельную страницу «Контакты» и добавить ссылку на нее в меню сайта. Тогда контактная информация будет условно доступна в любое время — посетители с первых секунд на сайте будут знать, где можно найти все данные.
Виджет с иконками. На платных тарифах доступны собственные виджеты Tilda, они находятся в блоке «Форма и кнопка»: В настройках можно изменить цвет фона и задать расположение виджета в десктопной версии сайта.
Не ограничивайтесь одним вариантом расположения кнопок соцсетей и мессенджеров, используйте сразу несколько способов. Особенно если у вас длинный лендинг или многостраничный сайт. А на посадочной странице, которая состоит из пары экранов, достаточно дать ссылки на соцсети только в шапке или в подвале сайта, чтобы не отвлекать посетителей от главного целевого действия.
Как установить кнопки соцсетей и мессенджеров на Wordpress
Обычно, когда идет речь о том, что нужно добавить кнопки соцсетей, имеют в виду кнопки «Поделиться», чтобы привлекать новых читателей в блог. Об этом даже есть инструкция в официальной справке Wordpress. А мы говорим о кнопках, чтобы посетители сайта сразу могли написать сообщение.
Плагин, который поддерживает одновременно 7 каналов коммуникации, нужно просто указать ссылки в настройках: Можно изменить последовательность иконок и скрыть те, которые вам не нужны. В результате вы получите виджет, который объединяет все способы связи: Facebook Messenger for WordPress
Плагин от того же издателя, что и предыдущий, но здесь диалог можно вести только в мессенджере Facebook. Можно настроить текст и цвет виджета, добавить кнопку в карточку товара и выбрать страницы, на которых должен работать плагин.
На сайте будет отображаться иконка мессенджера, которую посетители смогут перемещать как угодно, а также кнопка в карточке товара. Если пользователь захочет написать сообщение, появится всплывающее окно с формой: WhatsApp Chat WordPress
Еще один плагин, который поддерживает только одну соцсеть, но здесь довольно детализированные настройки. Кроме параметров отображения виджета на сайте, вы можете указать точный график работы и задать описание для онлайн и офлайн-режима: Кроме того, вы можете добавить несколько аккаунтов в WhatsApp с разным графиком работы: В виджете на сайте будут отображаться все операторы, даже те, кто не в сети. А в карточках товаров список операторов, которые сейчас онлайн: Easy VKontakte Connect
Плагин, который позволяет связать ваш сайт на Wordpress и сообщество ВКонтакте. Включает множество инструментов: авторизация через ВКонтакте, комментарии, кнопки, чтобы поделиться контентом в соцсети, а также виджеты для коммуникации с посетителями сайта: «Сообщения сообщества» и «Напишите нам».
Плагин, с помощью которого можно добавить на сайт иконки соцсетей — никаких раскрывающихся форм:
Плагин дает возможность выбрать нужную форму (квадрат, круг и так далее), размер иконок и цвет. Кроме того, вы можете использовать этот плагин, чтобы создать кастомные кнопки шеринга.
Использовать бесплатные виджеты кнопок соцсетей и мессенджеров
Есть готовые решения, чтобы установить на сайт кнопки разных соцсетей и мессенджеров, при этом не вносить серьезные правки в код сайта, а добавить один скрипт. При этом такой скрипт обычно работает на всех типах сайтов и CMS.
Здесь мы собрали несколько примеров таких сервисов.
GETBTN — бесплатный виджет кнопок для сайта, который можно использовать без регистрации.
Как создать виджет в GetBtn?
Настроить главную кнопку: выбрать иконку и цвета. Здесь же можно включить анимацию.
Настроить внешний вид иконок соцсетей и мессенджеров. Можно использовать шаблоны или собрать кнопки самостоятельно:
Задать параметры размещения виджета на сайте. Здесь же можно изменить направление открывания списка и изменить размер кнопок.
Когда закончите все настройки, введите email-адрес и система сгенерирует код, который нужно добавить на сайт:
Готово! Добавьте код на сайт и проверьте, что виджет работает.
Frisbie — условно бесплатный виджет кнопок соцсетей для сайта. Действительно, в сервисе есть бесплатный тариф, но он позволяет добавить только три кнопки: Whatsapp, Телефон и Почту. Платный тариф — 59 рублей в месяц. Но вы сможете передавать клики по кнопкам в системы веб-аналитики. А визуально виджет похож на GetBtn.
Spikmi Messenger — бесплатный виджет, в котором собраны кнопки для связи через мессенджеры. Отличительная особенность этого сервиса — расположение кнопок:
Как не пропустить сообщения, если клиенты пишут в разные соцсети и мессенджеры одновременно?
Вы добавили на сайт социальные кнопки, ура! Но не спешите радоваться, вас поджидает еще одна проблема.
Если раньше вы получали мало обращений через соцсети и мессенджеры, теперь их станет значительно больше. Сразу на всех площадках, которые вы добавили. Если их больше двух, вы начнете пропускать сообщения. Шутка ли, держать открытыми одновременно несколько вкладок и переключаться между ними: пока отвечаешь одному, прилетает еще два уведомления и так постоянно.
Можно поручить соцсети менеджерам, но они тоже люди: могут пропустить уведомление и не ответить на сообщение. А еще сотрудники будут отвлекаться на личные переписки. И контролировать рабочий процесс не получится — зона ответственности слишком размыта.
Да и база клиентов тоже не соберется. Не выписывать же каждого руками в тетрадку, правда?
Что делать? ?
Подключите агрегатор сообщений. Это сервис, который собирает все обращения клиентов в одном окне. Менеджеры будут отвечать через специальное приложение и никакие друзья-подруги их не отвлекут. А для клиентов диалог по-прежнему будет происходить в соцсети или мессенджере, куда он перешел с сайта.
Так можно работать через агрегатор Callibri:
Агрегатор позволит:
видеть отвеченные и неотвеченные сообщения из всех соцсетей и мессенджеров в одном окне,
проставлять ответственного менеджера и проверять качество его работы,
собирать и хранить базу клиентов — все обращения будут в отчете, а контакты клиентов — в мини-CRM.
Дать доступ можно неограниченному количеству менеджеров. Это безопасно — никто из них не сможет случайно запостить в официальный аккаунт что-нибудь не то.
Как это повлияет на установку кнопок?
Никак. Вы можете создать и настроить кнопки соцсетей любым из описанных в этой статье способов. Callibri подключается напрямую к соцсетям и собирает обращения, даже если клиент пришел не через сайт.
Или кнопки можно не настраивать совсем, а установить на сайт виджет Callibri. Это онлайн-консультант, в котором есть встроенные ссылки на соцсети и мессенджеры. И отдельный таб «Контакты» — на него можно добавить не только соцсети, но и карту:
Еще одно преимущество таких сервисов — идентификация пользователя. Если сегодня клиент обращается, например, через Facebook, а завтра — через Telegram, система позволяет связать эти обращения между собой.
Кстати, попробовать МультиЧат Callibri можно бесплатно: тестовый период длится 7 дней. Пользуйтесь!
У Callibri есть телеграм-канал — присоединяйтесь, чтобы не пропустить свежие кейсы, материалы блога и обновления сервисов.
Комментарии