Перейти до основного контенту

6/10 Створення форм у редакторі без коду та за допомогою AI

У цій статті ви дізнаєтеся, як створювати та налаштовувати форми й воронки продажів у Onepage, а також підключати їх до вашої CRM-системи.

Автор: Dmytro

Якщо ви хочете, щоб відвідувачі зв’язувалися з вами через ваш вебсайт або залишали свої дані, ви можете створювати та вбудовувати форми безпосередньо в Onepage.

Для цього у вас є різні можливості: ви можете скористатися шаблоном, побудувати форму повністю самостійно в редакторі або доручити її створення AI за допомогою Vibe Coding.


Створення форми з шаблону

Простий спосіб — створити форму з шаблону. При цьому ви можете або вставити шаблон у наявну сторінку, або створити з шаблону окрему сторінку з формою.

Вставлення шаблону форми в наявну сторінку

Додайте в редакторі нову секцію через синій значок + між двома секціями та перейдіть до розділу «Форми та воронки». Там ви знайдете різні шаблони форм, які можете перенести на свою сторінку й потім індивідуально налаштувати.

Серед шаблонів вам доступні як однокрокові, так і багатокрокові форми (воронки).

  • Однокрокова форма: усі поля заповнюються на одній сторінці й потім надсилаються разом.

  • Багатокрокова форма (воронка): введення даних розподілено на кілька кроків. Це підходить, наприклад, якщо ви хочете спершу поставити кілька запитань, а контактні дані запитати вже на пізнішому кроці.

Далі форми можна редагувати індивідуально. Ви можете, наприклад, додати інші поля, змінити наявні поля та налаштувати окремі кроки багатокрокової форми.

📌 Примітка: Число поряд із шаблоном показує, зі скількох кроків складається форма загалом. Фінальний слайд при цьому також враховується. Наприклад, шаблон із числом 2 складається з одного кроку форми + фінальний слайд (однокроковий). У шаблоні з числом 4 є три кроки форми + фінальний слайд (багатокроковий).

Створення нової сторінки з формою на основі шаблону

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

Для цього натисніть в огляді проєктів синю кнопку «Створити».


Відкрийте вкладку «Форми & Воронки». Далі оберіть відповідний шаблон і задайте назву для своєї нової сторінки.

📌 Примітка: Якщо вкладка «Форми & Воронки» недоступна, оберіть англійську мову контенту — цю опцію ви знайдете в налаштуваннях профілю.


Після цього форму буде створено як окрему сторінку, і її можна налаштувати в редакторі цілком на ваш смак.

Докладна інструкція: Створення багатокрокової форми (воронки)


Самостійне створення форм у редакторі

Ви також можете побудувати форму повністю самостійно, не використовуючи шаблон.

Для цього додайте в редакторі нову секцію через значок + між двома секціями і оберіть у порожню секцію у вкладці «Макети». Потім натисніть на + і в елементах перейдіть до розділу «Елементи форми».

Там ви можете крок за кроком додавати потрібні поля форми та збирати свою форму індивідуально. Ви можете, наприклад, додати додаткові кроки, налаштувати тло й оформити форму цілком за своїми вимогами.


Створення форм за допомогою AI

Форми та воронки ви також можете створювати за допомогою Vibe Coding. При цьому ви не обмежені наявними шаблонами, а можете доручити створення форм цілком за своїми уявленнями — навіть таких, для яких немає готового шаблону.

Ви можете, наприклад, описати AI, які поля має містити ваша форма, скільки кроків вона має мати або який вміст та які взаємодії вам потрібні. Так само можна реалізувати індивідуальний дизайн, анімації чи особливі ефекти.

Для цього додайте нову секцію через синій значок + між двома секціями та оберіть «Vibe-секція Створити за допомогою AI» . Після цього відкриється AI-чат.


Що конкретніше ви опишете AI свої уявлення, то краще AI зможе реалізувати вашу форму. Ви можете, наприклад, зазначити:

  • яку інформацію ви хочете запитувати у своїх відвідувачів

  • які поля мають бути обов’язковими

  • скільки кроків має мати ваша форма

  • які запитання мають з’являтися на якому кроці

  • як має бути оформлена форма

  • які анімації чи ефекти слід використати

  • яку дію слід виконати після надсилання

Згодом ви будь-коли можете й далі налаштовувати свою форму. Якщо, наприклад, бракує поля або вам потрібен додатковий крок, ви можете просто описати зміну в AI-чаті.

Докладна інструкція: Vibe-кодинг форм і воронок


Підключення форм до CRM

Щоб дані, зібрані через вашу форму, потрапляли у ваш Onepage CRM, форму має бути підключено до CRM.

У формі з шаблону ви знайдете для цього у фінальному слайді дію «Відправляти ліди в CRM». Її варто залишити активною, щоб передані дані зберігалися в CRM.

Якщо ви доручаєте створення форми Vibe Coding, ви можете вже у промпті зазначити, що форму слід підключити до CRM.

Ліди зберігатимуться у вкладці «Ліди» вашого проєкту.


💡Бажаєте залишити відгук до цієї статті? Будь ласка, напишіть у наш чат або за адресою support@onepage.io, і ми зможемо її покращити. Дякуємо! 🙂

Ви отримали відповідь на своє запитання?