Як додати форму або спливаюче вікно на ваш блог systeme.io

Ця стаття навчить вас, як налаштувати вбудовану форму або спливаючу форму на вашому блозі systeme.io.

Крок 1: Створіть вбудовану форму

Спочатку вам потрібно створити контактну форму у вашій воронці продажів.

Для цього перейдіть до вашої Воронки продажів, натисніть Створити крок (1), щоб створити новий крок, потім оберіть Вбудована форма (2).

Оберіть шаблон на свій вибір, натиснувши Вибрати (3).

Перейдіть до редактора сторінки форми, натиснувши Редагувати сторінку, щоб налаштувати вашу форму (4).

Контактна форма має містити принаймні одне поле форми, але ви можете додати стільки полів форми, скільки забажаєте.

Виберіть елемент Поле форми. Потім натисніть іконку налаштувань (шестерня), щоб налаштувати поле. Виберіть Тип поля, який ви хочете зібрати, зі спадного списку.

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

Не забудьте натиснути Зберегти зміни перед виходом з редактора або вашої вбудованої форми.

Крок 2: Створіть спливаючу форму

Перейдіть до вашої Воронки продажів, натисніть Додати крок (5), щоб створити новий крок, потім оберіть Спливаюча форма (6).

Оберіть шаблон на свій вибір, натиснувши Вибрати (7).

Перейдіть до редактора сторінки форми, натиснувши Редагувати сторінку (8), щоб налаштувати вашу спливаючу форму.

Контактна форма має містити принаймні одне поле форми, тому ви можете додати стільки полів форми, скільки забажаєте.

Також необхідно буде налаштувати кнопку, яка записуватиме дію, яку потрібно виконати із зібраними даними.

Ви можете вибрати час появи контактної форми на вашій сторінці блогу; цей час можна налаштувати за допомогою Редактора (Час потрібно вказувати в секундах).

Не забудьте натиснути Зберегти зміни перед виходом з редактора або вашої спливаючої форми.

Крок 3: Налаштуйте вбудовану форму на вашому блозі

Щоб додати контактну форму до вашого блогу, ви повинні скопіювати її скрипт і вставити його на сторінку вашого блогу.

Перший крок — повернутися до Налаштувань кроку вашої Вбудованої форми, потім вам потрібно натиснути Скрипт.

З'явиться спливаюче вікно з посиланням на сторінку вашої вбудованої форми. Натисніть Скопіювати посилання в буфер обміну.

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

Далі перетягніть і перемістіть елемент Raw HTML на вашу сторінку блогу.

Нарешті, вам потрібно буде перейти до налаштувань вашого елемента Raw HTML.

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

Обов'язково натисніть Зберегти, щоб зберегти HTML-код, натисніть Зберегти зміни в редакторі та збережіть перед виходом зі сторінки вашого блогу.

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

Крок 4: Налаштування спливаючої форми на вашому блозі:

Під час налаштування контактної форми як спливаючого вікна існує два можливі способи її відображення на сторінці вашого блогу:

Автоматично: Спливаюче вікно з'являється після певної затримки часу.
При натисканні: Спливаюче вікно з'являється, коли користувач натискає на певне посилання або текст.

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

Щоб відобразити спливаючу форму після натискання на текст, спочатку потрібно повернутися до Налаштувань кроку вашої спливаючої форми, потім вам потрібно натиснути Створити посилання.

З'явиться спливаюче вікно, яке дозволить вам натиснути на посилання, що відкриває спливаюче вікно з тексту:

Ви повинні вибрати вміст тексту, який буде клікабельним.
Ви повинні натиснути Скопіювати посилання в буфер обміну.

Відкрийте редактор сторінки блогу, на яку ви хочете додати посилання.

Потім вам потрібно налаштувати елемент Raw HTML на вашій сторінці блогу.

Нарешті, вам потрібно буде перейти до налаштувань вашого елемента Raw HTML**.***

Натисніть Редагувати код і вставте скрипт посилання, яке відкриває сторінку спливаючої форми, потім натисніть Зберегти.

Обов'язково натисніть Зберегти зміни в редакторі, щоб зберегти вашу сторінку перед виходом зі сторінки вашого блогу.

Якщо ми переглянемо сторінку блогу після цього, ми помітимо відображення спливаючої форми, коли натискаємо на текст Натисніть тут, щоб відкрити спливаюче вікно, як показано нижче: