Создание формы с элементами пользовательского ввода

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

Если вам просто нужна готовая форма, воспользуйтесь формой Формами Wix
Примечание:
Чтобы создавать формы с элементами пользовательского ввода, вам необходимо сначала добавить Менеджер контента на свой сайт. Если вы еще этого не сделали, нажмите здесь (или здесь для Editor X), чтобы узнать, как это сделать.

Шаг 1 | Добавьте Менеджер контента и создайте коллекцию

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

Чтобы добавить Менеджер контента и создать коллекцию:

  1. Перейдите в Менеджер контента в редакторе:
    • Редактор Wix: нажмите на значок Менеджер контента слева в редакторе.
    • Editor X: нажмите значок Менеджер контента в верхней части Editor X.
  2. Нажмите Создать коллекцию.
  3. Введите имя коллекции (эта коллекция будет содержать данные, вводимые пользователями).
  4. Нажмите Для чего предназначена коллекция? и выберите Отправка формы.
  5. Нажмите Создать коллекцию.
Совет:
Пока вы можете закрыть коллекцию. Вы можете в любой момент вернуться к просмотру данных, которые посетители вводят в вашу форму. Чтобы вернуться, просто перейдите в Менеджер контента в редакторе (шаг 1 выше) и выберите коллекцию.

Шаг 2 | Добавьте элементы пользовательского ввода на сайт

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

Чтобы добавить элементы пользовательского ввода:

  1. Нажмите на значок Добавить в левой части редактора. 
    • Редактор Wix: нажмите Добавить   в левой части редактора.
    • Editor X: нажмите Add Elements   в верхней панели Editor X.
  2. Нажмите Ввод данных.
  3. Нажмите и перетащите элементы, которые хотите использовать, и расположите их на странице, как вам требуется.

Шаг 3 | Настройте и подключите элементы пользовательского ввода

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

Для настройки и подключения элементов:

  1. Выберите первый элемент в редакторе.
  2. Нажмите Настроить.
  3. Введите нужную информацию и закройте панель Настройка.
  4. Для разных элементов может потребоваться ввод разной информации. Например, если вы добавили раскрывающийся список, вы увидите панель Управлять вариантами, которая позволяет вам вводить и упорядочивать варианты, которые вы хотите предложить.
  5. При желании нажмите на значки Макет  и Дизайн , чтобы настроить внешний вид элементов.
  6. Нажмите значок Подключить к данным  (или  в Editor X).
  7. (Только в первый раз) Создайте набор данных.
    1. Нажмите Создать источник данных.
    2. Щелкните раскрывающийся список Подключение коллекции и выберите коллекцию, созданную на шаге 1.
    3. (Необязательно) Измените имя источника данных.
    4. Нажмите Создать.
  8. Щелкните раскрывающееся меню Подключить значение к и выберите поле в своей коллекции (или добавьте новое) для хранения соответствующих данных.
Выполните эти шаги для каждого элемента пользовательского ввода. Но набор данных нужно создавать только один раз. Для всех остальных элементов на странице вы можете просто выбрать новый набор данных из раскрывающегося списка Подключить источник данных.

Шаг 4 | Добавьте кнопку отправки

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

Чтобы добавить кнопку отправки:

  1. Нажмите на значок Добавить в левой части редактора. 
    • Редактор Wix: нажмите Добавить   в левой части редактора.
    • Editor X: нажмите Add Elements   в верхней панели Editor X.
  2. Выберите Кнопка.
  3. Выберите кнопку и перетащите ее на сайт.
  4. Нажмите Изменить текст, чтобы изментить надпись на кнопке Отправить.
  5. Нажмите значок Подключить к данным (или в Editor X).
  6. Убедитесь, что в поле Подключить источник данных выбран правильный набор данных (по умолчанию она должна быть подключена к набору данных, добавленному на шаге 3).
  7. В меню Подключить действие при нажатии к выберите Отправить.
  8. При необходимости нажмите + сообщение об успехе.
    • На страницу будет добавлен текстовый элемент с сообщением по умолчанию для вашего выбора. Вы можете оставить текст по умолчанию или отредактировать его.
  9. При необходимости нажмите + сообщение об ошибке.
    • На страницу будет добавлен текстовый элемент с сообщением по умолчанию для вашего выбора. Вы можете оставить текст по умолчанию или отредактировать его.
      Совет: поскольку сообщение об успехе и об ошибке никогда не отображаются вместе, вы можете разместить один элемент над другим на странице. 
  10. В меню Куда направлять при успехе: выберите одно из следующих значений:
    • Оставаться на странице: посетитель остается на этой странице после отправки формы.
    • Ссылка: посетитель перенаправляется на другую страницу после отправки формы.

Советы:
  • Подключите форму к Автопроцессам Wix, чтобы получать уведомления об отправке формы, синхронизировать со списком контактов вашего сайта или подключиться к стороннему приложению. Подробнее.
  • Вы можете использовать 5 бесплатных форм Wix в месяц. Вы также можете бесплатно использовать 2 активных автопроцесса в месяц. Чтобы использовать больше форм или автопроцессов, вам необходимо приобрести план Ascend.

Была ли статья полезна?

|