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