Мы начинаем цикл обучающих статей по настройке сквозной аналитики Битрикс24. Как и во всех других обширных компонентах системы, эти настройки имеют свои особенности и нюансы.
Сегодня мы расскажем о первой части – настройке форм сайта, чтобы они передавали данные в Битрикс24. На основе полученных данных уже и будет работать компонент сквозной аналитики Битрикс24.
Вариантов решения данной задачи существует несколько.
Интеграция штатных веб-форм сайта 1С-Битрикс с Битрикс24 и проброс данных по REST API, самый сложный вариант.
Если сайт построен на Битрикс управление сайтом, то возможно попробовать передавать данные через штатную интеграцию 1С-Битрикс и Битрикс24, но этот функционал пока доступен только в новейшей коробочной платформе Интернет-магазин + CRM.
Третьим вариантом, которому и посвящена наша статья, является замена текущих форм сайта на CRM формы Битрикс24. Теперь давайте все по порядку.
Чтобы заменить формы на сайте на CRM формы Битрикс24, нужно начать с создания самих CRMформ, для этого нужно перейти в раздел CRM – CRM формы и нажать на кнопку «Создать формы». Также можете использовать уже готовые CRM-формы, только предварительно их отредактировав.
В настройках CRM-формы нужно добавить нужные поля и настроить дополнительные параметры, такие как очередь распределения заявок, в каком виде сохранять данные, например, в лид или сделку, какие поля заполонять автоматически и так далее.
После того, как форма настроена и сохранена, её в принципе уже можно размещать на сайте, используя специальный код, но тут начинается самое интересное. Так, как выглядит CRM-форма в Битрикс24 по умолчанию, не устраивает многих клиентов, так как она не вписывается в дизайн сайта.
Чтобы стилизовать форму, нужно использовать CSS, который можно потом указать в настройках формы. Например, попробуем сделать фон формы темным, а шрифт белым. Для этого нужно навести правой кнопкой мыши на нужный элемент и выбрать «Посмотреть код» (в разных браузерах по-разному). Затем нужно найти нужный элемент, в данном случае, например, нас интересует класс «.crm-webform-default».
Далее вписываем, подготовленный в режиме отладки, CSS в специальном поле CRM формы, после чего нужно не забыть сохранить изменения.
Пример кода:
.content {background-color: transparent;}
.crm-webform-wrapper {background: #424242; border-radius: 20px;}
.crm-webform-default, .crm-webform-header-container {background: #424242;}
.crm-webform-header, .crm-webform-label {color: #fff;}
button.crm-webform-submit-button {background: #949494; border-radius: 20px;}
.crm-webform-label-content {background: #757575; border-radius: 20px;}
.crm-webform-input {border: none; color: #fff;}
После чего проверяем саму форму, перейдя по её ссылке. Если всё верно, то можно копировать код формы и вставлять её на сайт.
Когда клиент перейдет по ссылке, например, из рекламной кампании Яндекс Директ, то форма, во-первых, передаст все UTM метки в специальное поле, а, во-вторых, укажет в пути клиента, какие страницы на сайте он посетил, отметив, что этот клиент пришел именно с рекламы.
На этом подключение CRM-форм на сайт можно считать завершенной. Теперь у Вас, если клиент заполнит такую форму, будет наиболее полная информация о его пути к Вам.
Как настроить сквозную аналитику Битрикс24 с точки зрения телефонии, читайте в следующей статье.
На нашем сайте можно изучить инструкцию для начинающих Битрикс 24 и сразу же приступить к работе в CRM.
