Виджет WhatsApp на сайте ставят в три шага: выбирают тип кнопки, вставляют её код на страницы и подключают канал к CRM, чтобы переписки не жили в личном телефоне менеджера. Самый простой вариант, прямая ссылка wa.me, работает за десять минут, но заявки при этом не попадают в CRM. Для связки с CRM нужен виджет через интегратор, например Wazzup.
На проектах B2BPRO.KZ чаще всего видим такую картину. На сайте стоит зелёная кнопка WhatsApp, заявки в мессенджере идут, а в CRM по ним пусто: менеджер отвечает с телефона, и о рекламном источнике никто не знает. Через квартал владелец не может сказать, окупилась ли реклама, потому что половина обращений осталась «вне системы». Ниже разберём, какие бывают виджеты, как поставить кнопку и как связать её с CRM без потерь.
Какие бывают виджеты WhatsApp для сайта?
Виджет WhatsApp для сайта: это кнопка или блок на странице, который открывает диалог с компанией в мессенджере. Различаются они тем, куда попадает переписка и что известно о посетителе. В обзоре Wazzup описаны четыре варианта, и эта классификация удобна как отправная точка: какой виджет WhatsApp лучше установить на сайт.
| Вариант | Как работает | Что с CRM | Для кого |
|---|---|---|---|
| Ссылка «прямая связь» (wa.me) | Открывает диалог с вашим номером, даже если человек не сохранил его в контактах | Переписка остаётся в WhatsApp, в CRM не попадает | Небольшой сайт, единицы обращений в день |
| Официальная кнопка «Общаться в WhatsApp» | Фирменная кнопка мессенджера в трёх размерах | То же, что у ссылки | Когда важен узнаваемый вид |
| Плавающая кнопка через сервис или HTML-код | Блок добавляется на все страницы одним кодом | Зависит от сервиса | Сайты на конструкторах и CMS |
| Виджет с интеграцией CRM | Кнопка подключена к каналу интегратора | Диалоги и заявки попадают в CRM | Продажи через мессенджер, реклама на сайт |
Важная деталь: у короткой ссылки wa.me номер указывается без скобок, плюсов и дефисов. Ошибка в формате номера приводит к тому, что кнопка открывает пустой или неверный диалог, и проверить это можно только руками.
Отдельно стоит отметить официальную кнопку «Общаться в WhatsApp»: по данным обзора Wazzup, надпись на ней доступна только на английском языке. Для русскоязычной аудитории это часто аргумент в пользу собственной кнопки с понятным текстом.
Как поставить простую кнопку WhatsApp на сайт?
Простую кнопку ставят ссылкой формата wa.me с номером компании: её можно оформить в любом блоке сайта и ничего не подключать. Это решение подходит, пока обращений мало и вся переписка идёт с одного телефона.
- Запишите номер компании в международном формате, только цифры: страна, код, номер.
- Соберите ссылку: адрес wa.me, косая черта и номер без пробелов, плюса и дефисов.
- Добавьте кнопку на сайт с понятным текстом: «Написать в WhatsApp», «Задать вопрос».
- Откройте страницу с телефона и с компьютера, нажмите на кнопку и убедитесь, что открывается диалог именно с вашим номером.
Плюс такой кнопки в том, что она работает и в приложении на телефоне, и в веб-версии WhatsApp. Минус виден сразу: компания не знает, откуда пришёл человек, а переписка остаётся в аппарате одного сотрудника. Если он уволится или заболеет, история диалога уйдёт вместе с ним.
Зачем связывать виджет с CRM
Связка с CRM нужна, чтобы каждое обращение становилось карточкой клиента с историей, ответственным и источником. Без неё мессенджер превращается в параллельный канал, который никто не контролирует.
Практический эффект такой:
- менеджер отвечает из CRM, и переписка остаётся в компании, а не в личном телефоне;
- руководитель видит, сколько обращений пришло и как быстро на них ответили;
- обращение закрепляется за ответственным, и его нельзя потерять при смене сотрудника;
- если подключена сквозная аналитика, понятно, с какой рекламы пришёл клиент.
Для компании в Казахстане, где значительная часть общения с клиентами идёт именно в WhatsApp, это не вопрос удобства, а вопрос контроля над продажами. Если у вас есть реклама, которая ведёт на сайт, переписки без атрибуции делают оценку каналов почти невозможной.
Как подключить виджет Битрикс24 на сайт через Wazzup?
Виджет Битрикс24 подключают в два этапа: сначала канал WhatsApp добавляют в Открытую линию в личном кабинете Wazzup, затем создают виджет в Контакт-центре Битрикс24 и вставляют его код на сайт. Это штатная функция CRM, а Wazzup обеспечивает подключение WhatsApp. Порядок описан в справке: как подключить виджет Битрикс24 на сайт.
Шаги по справке выглядят так:
- В личном кабинете Wazzup откройте раздел «Интеграция с CRM», выберите нужный канал и включите переключатель «Добавить в Открытую линию».
- В Битрикс24 перейдите в CRM, откройте вкладку «Клиенты», затем Контакт-центр.
- Выберите «Виджет на сайт» и создайте новый виджет.
- Укажите название виджета. Оно видно только вам, чтобы его было проще найти среди других.
- В разделе каналов выберите Открытую линию и нужные каналы для общения с клиентами.
- При необходимости настройте внешний вид, форму обратной связи, приветствие и рабочее время сотрудников, затем сохраните.
- Откройте список виджетов в Контакт-центре, выберите нужный и скопируйте его код.
- Вставьте код на сайт и опубликуйте изменения.
Обратите внимание на ограничение: виджет работает только с каналами Открытых линий, и все сообщения посетителей попадают в Открытую линию. Если вы не планируете работать в Открытых линиях, справка предлагает другой путь, сервис со сквозной аналитикой Yourgood.
Куда вставлять код виджета
Код виджета вставляют на страницы сайта либо перед закрывающим тегом body, либо в HTML-блок конструктора. Разница зависит от того, на чём собран сайт.
| Тип сайта | Куда вставлять код |
|---|---|
| Сайт на конструкторе (например, Tilda) | В блок для HTML. В Tilda по справке это блок T123 «Контент» из «Библиотеки блоков», раздел «Другое» |
| Сверстанный сайт | Перед закрывающим тегом body на каждой странице или в общий шаблон |
| Сайт на CMS (WordPress, 1С-Битрикс) | В общий шаблон подвала или через встроенную функцию вставки кода, чтобы кнопка была на всех страницах |
Для CMS справка Wazzup конкретных шагов не приводит, поэтому порядок зависит от вашей темы или шаблона. Общий принцип сохраняется: код должен быть в шаблоне, который выводится на всех страницах, иначе кнопка появится только там, куда вы её вставили руками.
После публикации проверьте работу на тестовом обращении: напишите со своего телефона через виджет и убедитесь, что диалог появился в Открытой линии и в карточке CRM.
Как передавать источник обращения: сквозная аналитика
Чтобы знать, с какой рекламы пришло обращение, нужен виджет со сквозной аналитикой. Он передаёт в CRM идентификатор посетителя, а из CRM данные уходят в сервис аналитики: Яндекс.Метрику, Google Analytics, Roistat или CoMagic. Так в обзоре Wazzup описан вариант с Битрикс24 и Wazzup.
У такого решения есть условия, которые легко недооценить:
- нужен скрипт аналитики, который обычно устанавливает разработчик;
- в предзаполненном тексте сообщения есть метка, и если клиент её удалит, данных для аналитики не будет;
- нужно настроить пользовательские поля в Битрикс24 и обновить данные в настройках интеграции Wazzup;
- по справке, метка не должна стоять в самом начале шаблона сообщения, иначе она не будет обработана.
Последний пункт стоит учитывать при формулировке приветствия: текст должен быть таким, чтобы клиенту не хотелось удалять служебную метку, и она читалась как часть обычного сообщения.
Если вам нужна не просто кнопка, а полноценная связка сайта, WhatsApp и CRM, B2BPRO.KZ как официальный партнёр Wazzup в Казахстане может сделать и внедрение, и оплату лицензии. Можно заказать внедрение Wazzup под ключ и получить настроенную интеграцию с CRM вместе с кнопкой на сайте.
Как выбрать вариант виджета под ваш бизнес
Выбор определяется тремя вопросами: сколько обращений приходит в WhatsApp, есть ли реклама, которую нужно оценивать, и кто отвечает клиентам. Ответы быстро сужают список до одного-двух вариантов.
- Если обращений единицы в неделю, а отвечает владелец, хватит ссылки wa.me. Подключать CRM ради десяти диалогов в месяц нет смысла.
- Если обращения идут каждый день и отвечает несколько человек, нужна переписка в CRM: иначе вы не увидите, кто и когда ответил.
- Если вы платите за рекламу, ведущую на сайт, нужна сквозная аналитика, иначе вы не поймёте, какие кампании приносят диалоги.
- Если у вас интернет-магазин или услуги с длинным циклом, важна история: к клиенту возвращаются через недели, и без карточки в CRM контекст теряется.
Простое правило: начинайте с минимума, который решает вашу задачу сегодня, но выбирайте решение, которое можно нарастить. Кнопка на ссылке легко заменяется виджетом с интеграцией, а вот привычку вести клиентов в личных мессенджерах потом переучивать дольше, чем настраивать код.
Как организовать работу менеджеров после подключения
Технически подключение занимает несколько часов, а вот перестройка привычек команды занимает недели. Поэтому вместе с кнопкой нужно подготовить правила работы с обращениями.
Что стоит определить заранее:
- кто отвечает на обращения в рабочее время и кто подменяет в обед и выходные;
- за сколько минут нужно отвечать на первое сообщение;
- что говорит приветствие вне рабочего времени и когда клиент получит ответ;
- как обращение передаётся от менеджера к менеджеру, если клиент пишет повторно;
- кто следит за тем, чтобы обращения не оставались без ответа.
Хорошая практика: в первые две недели после запуска раз в день просматривать диалоги и отмечать, где ответ задержался или оказался формальным. Эти замечания проще исправить сразу, чем через месяц, когда привычка закрепится.
Пример: как это выглядит на практике
Возьмём иллюстративный случай, а не конкретного клиента. Компания продаёт оборудование, реклама ведёт на посадочные страницы, а на сайте стоит кнопка со ссылкой на личный номер менеджера. Обращения идут, но в CRM о них ничего нет.
План изменений состоит из четырёх шагов. Сначала подключаем рабочий канал WhatsApp к интегратору и добавляем его в Открытую линию CRM. Затем создаём виджет в Контакт-центре и ставим его код на все страницы, включая рекламные посадочные. После этого настраиваем приветствие и рабочее время, а менеджерам объясняем, что отвечать нужно из CRM. На последнем шаге подключаем сквозную аналитику, чтобы видеть, какие кампании приносят диалоги.
Разница после запуска измеряется не красотой кнопки, а тем, что у каждого обращения появляется карточка, ответственный и источник. Именно это превращает мессенджер из «ещё одного канала» в управляемую часть воронки продаж.
Мобильная версия и удобство для посетителя
Большинство обращений в мессенджер приходят с телефонов, поэтому кнопку нужно проверять прежде всего на мобильных устройствах. Хорошая кнопка находится в зоне, до которой удобно дотянуться большим пальцем, и не закрывает важное содержимое страницы.
Обратите внимание на несколько деталей. Текст на кнопке должен быть понятным: «Написать в WhatsApp» говорит больше, чем просто значок. Приветственное сообщение лучше готовить заранее, чтобы человеку не пришлось придумывать первую фразу. Если на странице уже есть форма заявки, объясните разницу: форма для тех, кто не хочет писать в мессенджере, а кнопка для тех, кому так удобнее.
Не ставьте несколько плавающих элементов в одну зону экрана: кнопка чата, баннер согласия на куки и окно подписки мешают друг другу и раздражают посетителя. Один заметный способ связи работает лучше, чем три мелких.
Что делать с обращениями, которые пришли до подключения
До подключения интеграции часть клиентов уже писала на личный номер, и эти диалоги остаются в телефоне сотрудника. Выбросить их жалко, а переносить вручную долго, поэтому стоит решить, что действительно важно сохранить.
Разумный минимум: выписать активных клиентов, с которыми идёт работа сейчас, и завести на них карточки в CRM вручную, указав источник «WhatsApp, до подключения». Старые завершённые диалоги можно оставить в телефоне как архив, но договоритесь, где именно они хранятся и кто имеет к ним доступ. Для новых обращений правило простое: любой диалог начинается в канале, подключённом к CRM.
Отдельно предупредите сотрудников, что личный номер больше не используется для клиентских переписок. Иначе через месяц окажется, что половина клиентов по-прежнему пишет «своему» менеджеру, а новый канал работает только для случайных обращений с сайта.
Через месяц работы полезно сверить два числа: сколько диалогов зафиксировано в CRM и сколько обращений менеджеры оценивают на глаз. Если расхождение большое, значит часть переписок по-прежнему идёт мимо системы, и нужно разбираться, где именно.
Что проверить после установки виджета
После установки полезно пройти короткий чек-лист, потому что ошибки в виджетах проявляются не сразу, а когда уже идёт реклама.
- Кнопка видна на телефоне и на компьютере, не перекрывает важные элементы страницы и не закрывает кнопки согласия на куки.
- Нажатие открывает диалог именно с нужным каналом, а не с чужим номером или пустым чатом.
- Тестовое сообщение появилось в CRM, привязано к карточке и видно ответственному.
- Приветствие и рабочее время настроены, и вне рабочего времени человек получает понятный ответ.
- Если подключена аналитика, в CRM попадает источник обращения, а в сообщении сохраняется метка.
- Менеджеры знают, что отвечать нужно из CRM, а не с личного телефона.
Последний пункт организационный, и его пропускают чаще всего. Если сотрудник по привычке отвечает с телефона, в CRM остаётся только половина диалога, и вся настройка теряет смысл. Договоритесь о правиле: все клиентские переписки ведутся в CRM, и закрепите это в регламенте.
Типичные ошибки при установке виджета
- Ставят ссылку wa.me на личный номер директора, а не на рабочий канал компании.
- Номер записан с плюсом, пробелами или скобками, и ссылка открывается неверно.
- Виджет есть только на главной, а рекламные посадочные остались без кнопки.
- Кнопка перекрывает форму заявки или баннер согласия на мобильных устройствах.
- Канал подключён к CRM, но не добавлен в Открытую линию, и сообщения не доходят.
- Менеджеры продолжают отвечать с телефона, поэтому история диалогов в CRM неполная.
Большинство этих ошибок видно за пять минут тестового прохода. Поэтому после любой правки кнопки проверяйте весь путь клиента целиком: от нажатия на сайте до карточки в CRM. Повторяйте такую проверку после каждого обновления сайта или смены шаблона, потому что именно в эти моменты код виджета чаще всего пропадает со страниц.
Частые вопросы
Можно ли поставить кнопку WhatsApp на сайт бесплатно?
Да, самая простая кнопка делается обычной ссылкой формата wa.me и не требует платных сервисов. Минус в том, что переписка остаётся в WhatsApp и не попадает в CRM. Платные решения нужны, когда важно вести диалоги из CRM и видеть источник обращения.
Как узнать, с какой рекламы пришло обращение в WhatsApp?
Нужен виджет со сквозной аналитикой: он передаёт идентификатор посетителя в CRM, а оттуда в систему аналитики. Для этого требуются подключённый канал, скрипт аналитики на сайте и настроенные поля в CRM. Если клиент удалит метку из сообщения, данные об источнике не передадутся.
Нужны ли Открытые линии для виджета Битрикс24?
Да, виджет Битрикс24 работает только с каналами Открытых линий, и все сообщения посетителей попадают именно в них. Канал WhatsApp добавляют в Открытую линию в личном кабинете Wazzup. Без этого виджет не получит сообщения.
Куда вставлять код виджета, если сайт на Tilda?
В блок для HTML. Справка Wazzup указывает путь: «Библиотека блоков», раздел «Другое», блок T123 «Контент». После вставки кода опубликуйте страницу и проверьте работу кнопки на реальном обращении.
Почему менеджерам нельзя отвечать клиентам с личного телефона?
Потому что переписка уходит из компании и не попадает в CRM. При смене сотрудника история диалога теряется, а руководитель не видит ни скорости ответа, ни качества. Правило «отвечаем только из CRM» стоит закрепить в регламенте и проверять на практике.