Розширений спосіб налаштування форм - дозволяє збирати дані тільки з певних форм, й дасть можливість налаштувати форми у яких не виконується submit або якщо форми динамічні. Тобто цей спосіб є більш гнучкий, що дозволяє мануально налаштувати перехоплення ваших будь-яких форм із сайту.

Щоб перейти до налаштування, виберіть розділ “Інтеграція”, далі “Готові інтеграції”.

Потім оберіть серед списку інтеграцій "Інтеграцію з формами"

При першому налаштуванні форм оберіть пункт “Розширене налаштування (підключити кожну форму окремо)”

Якщо ж ви раніше вже налаштували інший тип інтеграції, то переключитися потрібно тут:

Обов'язково підтвердіть перемикання інтеграції, натиснувши на “Так” (у такий спосіб просте налаштування форм перестає працювати, і потрібно буде всі форми налаштовувати окремо при розширеному способі)

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

Таку форму можна назвати (до прикладу) Підключити – 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 для кнопки відправки форми.

Налаштування форми на цьому завершено і воно відображатиметься у вас ось так:

Наступним етапом необхідно налаштувати передачу даних з полів форм у поля СРМ-системи.

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

Додаткові налаштування форм та перевірка інтеграції з формами