Продвинутый способ настройки форм - позволяет собирать данные только с определенных форм, даст возможность настроить формы у которых не выполняется submit или в случае если формы динамические. То есть данный способ более гибкий, что позволяет мануально настроить перехват ваших любых форм с сайта.
​
Для перехода к настройке выберите раздел “Интеграции”, далее “Готовые интеграции”

Затем выберите среди списка интеграций “Интеграцию с формами”

При первичной настройке форм выбрать пункт “Продвинутая настройка (подключить каждую форму отдельно)”

Если же вы ранее уже настроили другой тип интеграции, то переключиться нужно здесь:

Обязательно подтвердив переключение нажав на “Да” (таким образом простая настройка форм перестает работать, и нужно будет все формы настраивать отдельно при продвинутом способе)

Сюда можно вписать любое название, лучше всего название формы, либо страницы, где она находится. Например, форма находится в шапке сайта на главной странице.

Ее можно назвать START NOW - header main. Таким образом понятно, что форма находится в шапке на главное странице и само название формы.

Если вы хотите, чтобы отрабатывала только часть форм, тогда добавьте список страниц где интеграция будет запускать отслеживание этой формы.

По умолчанию, в этом поле стоит регулярное выражение — * (звездочка), которая означает, что интеграция будет искать форму на всех страницах, которые есть на вашем сайте.

В данном поле нужно прописать путь к кнопке, которая отвечает за отправку формы. По аналогии с настройками XPath в скрипте — есть возможность выбрать поиск элемента по id, class, text (тогда интеграция сама сформирует XPath) или выбрать мануальный режим и ввести итоговый XPath самостоятельно.

- айди кнопки можно найти в коде сайта;

- кнопка может быть как типа button, так и просто input;

- кнопка может быть без сабмита;

- XPath (путь к элементу) необходимо создавать по аналогии с XPath-ами для подмены, главным отличием является то, что вместо одинарных кавычек должны быть двойные, то есть XPath будет выглядеть не так //ul[@id='new_list'], а вот так //ul[@id=”new_list”].

- XPath должен быть на сто процентов уникальным для элемента на странице, если на вашей странице в двух и более местах есть одинаковые формы, то нужно вносить корректировки в код кнопки с вашей стороны, чтобы сделать форму уникальной.

Форма появляется на сайте динамически - нужно отмечать, когда изначально формы нет в исходном коде сайте и она подгружается динамически после загрузки страницы или нажатию кнопки.

Самостоятельно отправлять данные формы в Ringostat — этот вариант настройки для продвинутых пользователей. В случае, когда стандартные настройки не дают возможности корректно работать интеграции с формами, нужно чтобы разработчик сайта клиента внес правки в код.

Для того, чтобы собрать данные с формы, разработчик вашего сайта должен прописать у себя в коде код-вызов:

window.ringostatAPI.sendFormDataToRingostat('id_формы', e);

Где:

- 'id_формы' — можно найти на странице со списком форм:

- е — это ивент, который есть у каждой кнопки и инпута. В 99% случаев достаточно так и написать “e”. В остальных случаях вместо “е” достаточно написать “event”.

В этом блоке настраиваются дополнительные действия по заполнению формы (если ничего не выбрано, то интеграция будет только передавать данные в СРМ).

Перезванивать клиенту после отправки формы — данная опция позволяет инициировать Callback-звонок клиенту сразу после заполнению формы клиентом на сайте

Перезванивать клиенту только в рабочие часы — по заполнению формы система будет инициировать Callback в рабочее время . Этот чек-бокс выступает дополнительной настройкой для предыдущего, т.е. нельзя просто отметить “Перезванивать клиенту только в рабочие часы” , нужно обязательно активировать чек-бокс “Перезванивать клиенту после отправки формы”.

Перезагрузить страницу после отправки формы — позволяет перезагружать страницу после отправки формы. Можно использовать, например, для того чтобы клиент увидел что что-то произошло после заполнения и отправки формы (например, появилась надпись “форма отправлена успешно” и форма отправилась).

В этом разделе нужно настроить список полей, данные из которых клиент хочет получать в СRM.

1.Из выпадающего списка нужно выбрать тип поля (Имя, Фамилия, Отчество, ФИО, Телефон, Почта, Другое)

При настройке формы вы только один раз сможете добавить поля каждого из этих типов. То есть можно добавить одновременно поля Имя, Фамилия и так далее, но у вас может быть только одно поле Имя, одно поле Фамилия и т.д в рамках одной формы.

Тип поля Другое — для одной формы можно создать до 10 полей этого типа.То есть вы можете создать 10 полей с типом Другое, если вам необходимо передавать данные не только из стандартных полей, но и, например, из поля Комментарий или любых других ваших кастомных полей.

Дополнительно вы можете выбрать для таких полей как Имя, Фамилия, Отчество, ФИО, Почта, Телефон, Другое галочку “Поле является обязательным к заполнению”. Таким образом интеграция будет подсвечивать поле красной обводкой и блокировать обработку формы, если пользователь не заполнил это поле.

А также для полей Телефон и Почта есть возможность включить валидацию.

Таким образом, для поля Телефон активируется плагин валидации номеров телефона (такой же, как запускается на нашем Callback), у клиента будет подставляться флажок страны:

А для Почты при такой настройке в момент заполнения поля интеграция будет проверять валидную ли почту ввел клиент.

2. Теперь нужно прописать путь к полю формы. Прописываем его идентично как мы прописывали XPath для кнопки отправки формы.

Настройка формы на этом завершена и она будет отображаться у вас вот так:

Следующим этапом необходимо настроить передачу данных из полей форм в поля СРМ-системы и проверить работу форм.

Простой способ интеграции форм

Дополнительная настройка форм и проверка интеграции с формами