Как сделать форму битрикс
Добавил пользователь Morpheus Обновлено: 04.10.2024
Приступим и создадим специальную форму, а все заполненные данные автоматически поступят к нам в CRM Битрикс24.
Рассмотрим процесс создания CRM-формы и разберём её основные параметры:
Например, мы хотим создать форму для регистрации клиентов на вебинар.
Для создания новой формы нажмите кнопку Создать форму на странице CRM – Еще – CRM-формы.
Введём название новой формы, её заголовок и описание. Название формы клиент не увидит, старайтесь назвать ее так, чтобы вам было легко отличить CRM-формы друг от друга в списке. Заголовок и описание формы предназначены для клиента.
Далее необходимо определить поля, которые будет заполнять пользователь. Выберите нужные поля из списка элементов CRM и простым нажатием добавьте их в форму. Поля можно перемещать и располагать в любом порядке.
Также вы можете добавить секцию, разделитель или разрыв строки.
Если вы добавите поля из разных элементов, к примеру сделки и контакта - система предупредит вас об этом и предложит создать недостающие поля.
Каждое поле можно настроить - изменить название, подсказку по заполнению и значение по умолчанию.
При необходимости поле можно сделать обязательным или добавить проверку - к примеру, на то, что пользователь ввёл корректный электронный адрес.
Мы добавим поля Имя, Телефон, E-mail, сделаем их обязательными для заполнения.
Также добавим пользовательские поля VIP-клиент и Клубная карта.
Затем зададим текст и цвет для кнопки отправки формы, а также определим ответственных за новые элементы.
Обработка формы будет распределяться равномерно между всеми ответственными.
Дополнительные параметры CRM-формы Подпись. Поставьте галочку, если следует убрать из формы подпись Заряжено Битрикс24. Эта возможность доступна только на платных тарифах.
Правила для полей. С помощью правил вы можете создать простую логику для вашей формы.
Например, если пользователь поставил галочку в поле VIP-клиент, то ему будет показано поле для ввода номера клубной карты.
Создание документов. Здесь мы определяем, какой элемент CRM создавать при заполнении формы - лид, контакт, сделку или предложение. При необходимости можно создавать счёт, который клиент сможет оплатить сразу после заполнения формы.
Выбираем действие для найденных дубликатов. По умолчанию, Битрикс24 будет объединять все дубли. Если из CRM-формы создаётся сделка - Битрикс24 может использовать активную сделку, не создавая новую. Поиск сделки происходит по имени контакта или названию компании.
Значения полей по умолчанию. В этом блоке вы можете выбрать поля документов и указать их значения по умолчанию. К примеру, можно задать произвольное имя для создаваемого лида. Мы так же укажем отдельный источник для лидов, созданных при заполнении данной формы (источники задаются в настройках CRM – Справочники).
В качестве значений можно использовать специальные теги персонализации - система автоматически заменит этот тег на нужное значение:
Метрика. Если на вашем сайте используются системы веб-аналитики Google Analytics или Яндекс Метрика - добавьте в этом блоке нужные идентификаторы. Также вы можете включить создание событий виртуальных страниц для отображения в воронке Google.
Вид формы и CSS. Не стоит забывать и про внешний вид создаваемой формы. Вы можете выбрать оформление, загрузить фоновую картинку и при необходимости даже использовать собственные CSS стили.
Согласие на обработку персональных данных. CRM-форма работает с данными пользователей, поэтому требуется обязательное согласие на обработку. Создайте соглашение или выберите готовое - после этого на форме появится необходимый по закону пункт.
Мы хотим получать только корректные данные, поэтому иногда полезно активировать защиту от спама. В этом случае гостю перед отправкой формы придётся подтвердить, что он человек.
Реклама. Данный пункт используется для того, чтобы связать форму с рекламой в ВКонтакте и Facebook .
Обратный звонок. С помощью формы обратного звонка посетитель оставляет свои данные и менеджер моментально сможет среагировать и связаться с клиентом.
Ссылка и коды. Форму можно использовать не только на сайте, но и заполнять по прямой ссылке. Ссылку можно скопировать в соответствующем поле.
Есть несколько вариантов показа формы на сайте - внутри страницы, по нажатию на кнопку/ссылку или во всплывающем окне.
Форма готова, нажимаем Сохранить. Для того, чтобы активировать CRM-форму, находим ее в списке и нажимаем Включить.
Форма готова для размещения на сайте. Скопируйте код для нужного варианта, разместите на сайте и начинайте получать данные от пользователей.
Затем выберите вид блока и настройте отображение формы.
Готово! Данные формы, заполненные пользователем, попадут в CRM для дальнейшей работы.
Чтобы просматривать и создавать CRM-формы в Битрикс24, необходимо иметь права администратора или права на чтение, изменение в настройках прав доступа CRM:
Чтобы перейти к конструкторам CRM-форм, перейдите в CRM — Еще — CRM-формы:
На портале доступны два вида конструктора CRM-форм: классический и новый.
Переключиться с одного конструктора на другой можно в любой момент, перейдя в раздел CRM > Настройки > Другое > Прочие настройки
Рассмотрим более детально работу нового конструктора CRM-форм.
Например, мы хотим создать форму для регистрации клиентов на вебинар.
Для создания новой формы нажмите кнопку Создать форму.
Перед вами откроется окно с выбором сценария работы формы.
В нашем случае подходит форма для сбора контактных данных. После выбора откроется окно настройки формы с разделами, соответствующим сценарию работы формы.
Необходимо определить поля, которые будет заполнять пользователь.
Выберите нужные поля из списка элементов CRM и простым нажатием добавьте их в форму.
Поля можно перемещать и располагать в любом порядке.
Также вы можете добавить разделите формы:
Для нашей формы мы добавим поля Имя, Телефон, E-mail, сделаем их обязательными для заполнения. Также добавим пользовательские поля VIP-клиент и Клубная карта.
Перейдем к разделу формы Соглашения.
CRM-форма работает с данными пользователей, поэтому требуется обязательное согласие на обработку.
В этом разделе находятся примеры соглашений на обработку персональных данных, которые вы можете вставить в свою форму или же создать собственное соглашения, нажав на одноименную функцию.
В разделе Сущности в CRM вы определяете, какой элемент в вашей CRM будет создаваться на основании заполненной формы — лид, контакт, сделка + контакт, предложение + контакт.
Выбираем действие для найденных дубликатов. По умолчанию, Битрикс24 будет объединять все дубли.
Если из CRM-формы создаётся сделка, Битрикс24 может использовать активную сделку, не создавая новую. Поиск сделки происходит по имени контакта или названию компании.
На вкладке Размещение формы вы выбираете, каким образом вы будете размещать свою форму на сайте.
В разделе Другие настройки вы можете задать Название формы (название формы клиент не увидит, старайтесь назвать ее так, чтобы вам было легко отличить CRM-формы друг от друга в списке).
Настройка Ответственный позволяет настроить пользователей, которые будут обрабатывать созданные в CRM элементы после заполнения формы.
Также вы можете установить язык системных предупреждений в поле Язык.
На коммерческих тарифах можно отключить подпись Заряжено в Битрикс24. На бесплатном тарифе такая опция не предусмотрена.
После всех настроек CRM-формы нажмем Сохранить. Далее перейдем в дизайнер формы.
Здесь вы можете определить расположение формы на странице, а также поменять цвет фона формы.
Для того, чтобы изменить дизайн самой формы, необходимо нажать на нее. Здесь вы сможете изменить такие параметры, как тема, тень, шрифт, цвета различных элементов формы и т. д.
Если вам покажется, что данных настроек будет мало для создания вашей CRM-формы, вернитесь в редактор формы и выберете сценарий работы с формой Экспертный режим.
Данный сценарий предполагает использование всего инструментария конструктора CRM-форм.
На вкладке Заголовок и кнопка вы можете задать текст для заголовка, подзаголовка и текст кнопки, предназначенной для отправки данных.
Раздел Правила показа полей.
С помощью правил вы можете создать простую логику для вашей формы. Например, если пользователь поставил галочку в поле VIP-клиент, то ему будет показано поле для ввода номера клубной карты.
Раздел Значения полей по умолчанию.
В этом блоке вы можете выбрать поля документов и указать их значения по умолчанию.
К примеру, можно задать произвольное имя для создаваемого лида.
Мы так же укажем отдельный источник для лидов, созданных при заполнении данной формы (источники задаются в настройках CRM — Справочники).
Метрика. Если на вашем сайте используются системы веб-аналитики Google Analytics или Яндекс Метрика — добавьте в этом блоке нужные идентификаторы.
Также вы можете включить создание событий виртуальных страниц для отображения в воронке Google.
Мы хотим получать только корректные данные, поэтому иногда полезно активировать защиту от спама. В этом случае гостю перед отправкой формы придётся подтвердить, что он человек.
Реклама. Данный пункт используется для того, чтобы связать форму с рекламой в ВКонтакте и Facebook.
Обратный звонок. С помощью формы обратного звонка посетитель оставляет свои данные и менеджер моментально сможет среагировать и связаться с клиентом.
Примечание: для использования данного функционала необходимо иметь подключенный номер к телефонии Б24.
Форма готова, нажимаем Сохранить.
Для того, чтобы активировать CRM-форму, находим ее в списке и нажимаем Включить.
Размещение на сайте. Скопируйте код для нужного варианта, разместите на сайте и начинайте получать данные от пользователей.
Затем выберите вид блока и настройте отображение формы. Готово!
Благодаря новому конструктору CRM-форм можно более детально проработать форму как со стороны функционала, так и дизайна.
Весь процесс можно разделить на 3 условных блока:
- Создание формы в админке
- Вывод формы на соответствующей странице в публичной части
- Добавление обработчика в init.php
Создание веб-формы в админке
Для того, чтобы создать форму с загрузкой файлов нужно:
1. Создание формы и подключение всех скриптов для валидации формы
Созданим папку /return/ и поместим туда все файлы с формой.
Файл index.php будет таким:
Скрипты и стили подключены через методы Битрикс. В форме с файлами будет сделана подмена стандартной кнопки (свой стили), чтобы кнопка была более презентабельной.
Далее необходимо создать файл со скриптом, script.js с содержимым кода.
Пояснения по файлам:для валидации форм используется jquery validate. Для телефона используется маска, jquery input mask.
Если форма не заполнена, то валидатор сообщит об этом:
2. Создать инфоблок со свойствами, создать почтовый шаблон
Далее переходим в админ панель Битрикс и создаем свойства: имя, телефон, фотография, копия. Будет 2 файла с картинками.
Переходим в Настройки-Почтовые и смс события-Типы событий в меню админки Битрикс. Или по адресу: /bitrix/admin/type_edit.php?lang=ru и создаем следующее содержание.
Создаем новое событие: FORM_RULES_RETURN с памятку с полями:
В почтовых шаблонах выбираем созданное событие FORM_RULES_RETURN и добавляем поля, которые есть в форме.
3. Создать скрипт php для проверки файлов, их загрузки, сохранением в инфоблок, отправки на почту уведомлений
Скрипт называется ajax_form.php и будет со следующим содержимым.
Здесь необходимо ввести номер информационного блока, чтобы все было корректно. В данном случае это 52 инфоблок.
Также нужно создать в корне папку для временного сохранения файлов картинок: tmp_img
Файлы можно прикреплять как вложения, но здесь рассмотрен более простой вариант.
Дальше уже все проверять и тестировать.
Надеюсь статья была полезной, оставьте отзыв или мнение, что можно улучшить.
Читайте также: