Обзор форм - помощь Webflow
Настройте формы Webflow для сбора данных.
Добавьте и настройте формы Webflow.
Формы — это один из самых мощных инструментов в интернете, позволяющий эффективно собирать информацию, будь то подписка на рассылку или запросы от потенциальных клиентов. С Webflow вы можете полностью настроить и оптимизировать свои формы под свои нужды. Вы можете добавить блок формы на свой сайт из Панель добавления → Элементы → Формы.
Анатомия формы
Блок формы наследует полную ширину родительского элемента и содержит три дочерних элемента:
- Форма — содержит все ваши поля ввода и элементы формы
- Сообщение об успехе — сообщение, возвращаемое при успешной отправке формы
- Сообщение об ошибке — сообщение, возвращаемое при возникновении проблемы с отправкой формы
Структура формы
Вы можете добавить или удалить любой из следующих элементов формы, чтобы настроить форму по своему усмотрению:
| Элемент формы | Назначение |
|---|---|
| Метка поля | Используется для описания функции или назначения поля формы. Метки полей важны для доступности. |
| Поле ввода | Используется для сбора данных в одну строку, например, короткий ответ на вопрос (например, имя или адрес электронной почты) |
| Загрузка файла | Позволяет посетителям сайта прикрепить файл к своей отправке формы |
| Текстовая область | Позволяет посетителям сайта вводить многострочные данные, например, длинное сообщение |
| Флажок | Используется для ввода данных, где посетители сайта могут выбрать один или несколько вариантов |
| Переключатель | Используется для ввода данных, где посетители сайта могут выбрать только один из многих вариантов |
| Выбор | Используется для того, чтобы посетители сайта могли выбрать варианты из выпадающего списка. Возможен множественный выбор |
| reCAPTCHA | Сервис Google, предотвращающий спам в формах |
| Кнопка отправки | Отправляет все данные, собранные в форме. Ни одна форма не завершена без Кнопки отправки |
Элементы формы можно добавлять только внутри блока формы.
Как настроить элементы формы
Вы можете дважды щелкнуть элемент формы (например, поле ввода, кнопку отправки), чтобы открыть его настройки. Каждый элемент формы имеет разные настройки ввода в зависимости от его типа:
| Настройка ввода | Назначение | Дополнительные заметки |
|---|---|---|
| Имя | Идентифицирует поле в отправках формы | н/д |
| Обязательное | Позволяет требовать заполнение поля формы для отправки формы | Блокирует пустые отправки |
| Заполнитель | Показывает текст в поле ввода, который исчезает при вводе; не должен заменять метки или важные инструкции | Недоступен для вспомогательных технологий или инструментов перевода; стилизуется из меню состояний |
| Тип текста | Указывает тип ввода (например, email, телефон, пароль) | Телефон принимает символы и показывает клавиатуру; пароль скрывает введенные символы |
| Автофокус | Определяет, будет ли поле автоматически фокусироваться при загрузке страницы | Следите за проблемами прокрутки/прыжков или скрытыми полями, блокирующими отправку |
Настройки кнопки отправки позволяют установить:
- Текст кнопки: Что отображается на кнопке (по умолчанию: «Отправить»)
- Текст ожидания: Что заменяет кнопку после нажатия и до завершения отправки (по умолчанию: «Пожалуйста, подождите...»)
Как управлять настройками формы
Настройка состояний успеха и ошибки
Выберите блок формы и перейдите в Настройки блока формы, чтобы:
- Обычное: Состояние по умолчанию
- Успех: Сообщение после успешной отправки
- Ошибка: Сообщение после неудачной отправки
Мы рекомендуем включать адрес электронной почты в случае ошибки, если у посетителей сайта возникнут проблемы с отправкой формы.
Установите имя формы
Имя, которое вы задаете, связывает форму с данными ее отправки. Если вы не зададите уникальные имена, все данные отправки будут отображаться под «Email Form». Дайте описательные имена, чтобы различать формы.
Управление отправками форм и уведомлениями
- Укажите получателей в настройках блока формы.
- Доступ к расширенным уведомлениям в настройках сайта → Формы → Уведомления формы.
- Для полных владельцев сайта: доступ/управление данными формы в настройках сайта → Формы → Отправки формы.
Перенаправление посетителей сайта при отправке формы
Добавьте URL в поле Перенаправление, чтобы отправить пользователей в другое место после отправки.
Установите пользовательское действие
Добавьте пользовательское действие для отправки данных в другое место (например, HubSpot). Когда вы добавляете это, Webflow не обрабатывает и не отправляет уведомление. Вы также можете подключить приложения для большего количества интеграций.
Просмотр подключений приложений
Подключенные приложения будут отображаться в Подключениях. Примечание: Отправка данных формы в Webflow всегда отображается, если вы полностью не обходите обработку Webflow.
Данные формы и GDPR
Содержимое здесь предоставляется только для информации и НЕ является юридической консультацией.
- Если вы собираете личные данные от жителей ЕС (включая через формы), вы являетесь контролером данных в соответствии с GDPR.
- Получите соответствующее согласие на сбор данных.
- Если вы создаете для клиентов, обучите их их обязанностям.
- Пересмотрите обязанности, если подключаете данные к третьим сторонам (например, Zapier).
Узнать больше:
Устранение неполадок
Если вашу форму нельзя отправить:
- Если вы включили reCAPTCHA, убедитесь, что все формы его содержат. В противном случае отправка не удастся.
- Если у вас есть скрытые поля, убедитесь, что Автофокус отключен для них.
- Бесплатные/нехостинговые сайты ограничены 50 общими отправками форм. Обновите план сайта, чтобы снять ограничение.
Если проблемы сохраняются, свяжитесь со службой поддержки.
Если вы экспортируете свой сайт, Webflow не будет обрабатывать отправку форм. Используйте сторонний инструмент для их сбора или встроите стороннюю интеграцию формы.