CMS: Настройка пользовательской формы с помощью элементов выпадающего списка
24 мин.
Создавайте настраиваемые формы, которые позволяют посетителям использовать раскрывающиеся списки для отправки своей выбранной опции прямо в ваши коллекции CMS. В этой статье описан процесс добавления выпадающего списка и кнопки «Отправить». Вы подключите оба элемента к набору данных, который позволит сохранять ответы посетителей в вашей коллекции CMS.
После выполнения этих шагов вы можете раскрыть форму, добавив еще элементы ввода и подключив их к одному набору данных.
Прежде чем начать:
Добавьте CMS на сайт, если вы еще этого не сделали.
Шаг 1 | Добавьте выпадающий список
Перейдите на страницу в редакторе, где вы хотите создать собственную форму, а затем добавьте выпадающий список.
Редактор Wix
Редактор Studio
- Перейдите в редактор.
- Перейдите на страницу, на которую вы хотите добавить элементы ввода.
- Нажмите Добавить элементы
в левой части редактора. - Нажмите Ввод.
- Нажмите Выпадающий список.
- Нажмите и перетащите выпадающий список на страницу.
Совет:
Добавьте больше элементов ввода для каждого типа информации, которую посетители должны отправить. Добавляемые вами элементы ввода определяют типы полей, к которым они могут подключаться и типы данных, которые они могут сохранять.
Шаг 2 | Подключиться к CMS
Подключите выпадающий список к набору данных, который подключается к коллекции CMS, в которой вы будете хранить данные.
Вы можете добавить параметры, которые отображаются в раскрывающемся списке вручную, или использовать элементы из другой коллекции CMS. Чтобы использовать элементы из CMS, подключите параметры раскрывающегося списка к другому набору данных, который подключается к полю в другой коллекции.
Редактор Wix
Редактор Studio
- В редакторе добавьте набор данных, который подключается к коллекции, в которой вы сохраните ответы:
- Нажмите CMS
слева. - Нажмите Элементы контента.
- Нажмите Форма набора данных.
- Нажмите на раскрывающийся список Подключение коллекции и выберите коллекцию для хранения ответов.
- Дайте набору данных название (например, Ответы формы).
- Нажмите Создать.
- Нажмите CMS
- Нажмите на выпадающий список и выберите Собирать информацию в панели Подключить выпадающий список справа.
- Нажмите на раскрывающийся список Выбрать набор данных и выберите свой набор данных «Ответы».
- Подключите элемент ввода выпадающего списка к новому полю коллекции для хранения отправленных данных:
- Нажмите на раскрывающийся список Подключить значение к и выберите Добавить новое поле:
- Введите Название поля для нового поля коллекции.
- (Только код) Введите ключ поля, который идентифицирует это поле в коде сайта. Это нельзя изменить позже.
- Нажмите на раскрывающийся список Тип поля и выберите тип поля "Текст", "Число" или "Ссылка" в зависимости от типа данных, которые вы хотите собрать.
Совет: для типов полей «Ссылка», выберите нужную коллекцию из раскрывающегося списка. - Нажмите Добавить.
- Нажмите переключатель Показать варианты из коллекции,чтобы выбрать, где управлять вариантами раскрывающегося списка:
- Включено: используйте для выбора поле из другой коллекции CMS. Подключите соответствующий набор данных и выберите поля для использования из раскрывающегося списка Подключить метки и значения к.
- Отключено: нажмите Управлять вариантами, чтобы создать статические варианты выбора для элемента отдельно от CMS.
- (Если вы добавили другие элементы ввода) Подключите входные данные к набору данных «Отправки»:
- Нажмите на соответствующий элемент ввода.
- Нажмите на значок Подключить к CMS
. - Повторите шаги 3-4 выше, чтобы подключить входные данные к набору данных «Отправки».
- Повторите этот шаг для каждого элемента ввода, который вы хотите добавить в форму CMS.
А как насчет режима набора данных?
- Если вы добавили «Набор данных формы», он уже правильно установлен на режим«Запись». Этот режим позволяет набору данных добавлять новые элементы в коллекцию «Отправка» на основе отправленных элементов в выпадающем списке.
- Если вы подключили параметры списка, которые посетители выбирают в выпадающем списке, убедитесь, что отдельный набор данных находится в режиме «Чтение» или «Чтение и запись».
- Если вам нужно, чтобы форма CMS обновляла существующие элементы коллекции, установите набор данных «Отправка» в режим «Чтение и запись». Убедитесь, что разрешения доступа к коллекции также позволяют людям с соответствующими ролями обновлять контент.
Шаг 3 | Настроить разрешения доступа к коллекции
Установите разрешения доступа для коллекции, в которой вы будете хранить ответы. Вы можете выбрать готовый параметр Собирать контент, который позволяет посетителям добавлять контент, а затем указать, кто может его добавлять. Или вы можете выбрать Расширенные разрешения, чтобы контролировать, кто может просматривать, добавлять, обновлять и удалять элементы коллекции.
Редактор Wix
Редактор Studio
- Нажмите CMS
слева в редакторе. - Нажмите Ваши коллекции.
- Наведите курсор на коллекцию «Отправки» и нажмите на значок Другие действия
. - Нажмите Разрешения и конфиденциальность.
- Выберите, какие разрешения использовать для коллекции:
- Выберите тип разрешений доступа, которые вы хотите использовать для коллекции:
Собирать информацию
Расширенный
Шаг 4 | Создание кнопки отправки
Вам нужно создать способ, чтобы посетители могли отправлять или выбирать ответы на элементы ввода, которые они ввели или выбрали. Создайте кнопку «Отправить», добавив обычную кнопку или изображение и подключив их к действию при нажатии «Отправить». Когда посетители нажимают кнопку «Отправить», значения из элементов ввода выпадающего списка, которые подключены к набору данных «Отправка», сохраняются в коллекции. В зависимости от режима набора данных и разрешений на сбор, значения либо добавляются как новые элементы, либо используются для обновления существующих элементов.
Вы также можете создать отдельные кнопки для следующих действий с набором данных:
- Новое: Добавьте или обновите элементы коллекции (в зависимости от режима набора данных) и сбросьте входные данные, чтобы принимать новые значения.
- Вернуть: Сбросьте значения в элементах ввода, которые еще не были отправлены.
- Удалить: Уберите выбранные элементы из коллекции (только в режиме «Чтение и запись»).
- Следующая страница/ Предыдущая страница: Если вы отображаете элементы, которые редактируют посетители, в галерее или репитере, вы можете добавить эти кнопки, чтобы посетители могли перемещаться по «страницам» элементов. Если вы создали форму на динамической странице элемента, используйте опцию Следующая динамическая страница / Предыдущая динамическая страница.
Редактор Wix
Редактор Studio
- Нажмите Добавить элементы в левой части редактора.
- Нажмите Кнопка.
- Нажмите и перетащите на страницу кнопку, которую вы хотите использовать в качестве кнопки отправки. Вы можете использовать любые из следующих типов кнопок: кнопки в стиле шаблона, кнопки с текстом и значками, или кнопки с изображениями.
Совет: вы также можете добавить изображение и использовать его в качестве кнопки отправки.
- Нажмите Изменить текст и значок и введите текст, который будет отображаться на кнопке (например, «Отправить»).
- Нажмите значок Подключить к CMS .
- Нажмите на раскрывающийся список Выберите набор данных и выберите набор данных, подключенный к коллекции отправленных данных.
- В меню Подключить действие при нажатии к выберите Отправить.
- (Необязательно) Добавьте сообщения об успехе и об ошибке, которые появляются при успешной или неудачной отправке:
- Нажмите + Сообщение об успехе, затем нажмите + Сообщение об ошибке.
- Нажмите и перетащите оба сообщения в то место, где вы хотите их отобразить. Они могут перекрываться, поскольку сообщения отображаются не одновременно.
- Нажмите Редактировать текст в каждом сообщении, чтобы отредактировать сообщения.
- Выберите кнопку и нажмите на значок Подключить к CMS . Затем в меню Куда направлять при успехе выберите опцию:
- Оставаться на странице: посетитель остается на этой странице после отправки формы.
- Ссылка: после отправки формы посетитель перенаправляется на другую страницу. Нажмите Выбрать в разделе Выберите ссылку и настройте ссылку.
- Нажмите на кнопку и выберите значок Дизайн
для настройки внешнего вида кнопки «Отправить».
Шаг 5 | Настройте выпадающий список
Установите заголовок, текст-заполнитель и другие параметры из раскрывающегося списка. Настройте внешний вид элемента на панели «Дизайн» и настройте выравнивание, интервалы и отступы в панели «Макет».
Редактор Wix
Редактор Studio
- В редакторе нажмите на выпадающий список.
- Нажмите Настройка и измените следующее:
- Название поля: введите заголовок, который будет отображаться в верхней части выпадающего списка.
- Показать при загрузке: выберите текст, который увидят посетители, прежде чем нажать выпадающий список:
- Ничего: посетители видят пустое поле перед тем, как нажать на выпадающий список.
- Текст-подсказка: используйте свой собственный текст в выпадающем списке (например, «Выберите свой цвет»). Введите текст в текстовое поле Текст-подсказка.
- Элемент из выпадающего списка: покажите элемент из выпадающего списка. Если вы подключили список к CMS, элемент, который появится, будет первым из выпадающего списка, который посетители смогут выбрать. Если вы не подключили элементы списка к CMS, нажмите Выберите элемент из списка, чтобы выбрать, какой элемент появится.
- Автозаполнение: нажмите на переключатель, чтобы определить, что происходит, когда посетители вводят текст в раскрывающийся список:
- Включен: в раскрывающемся списке отображаются только варианты, которые соответствуют введенному тексту.
- Отключено: все варианты отображаются в раскрывающемся списке.
- Тип выпадающего списка: выберите один из вариантов:
- Настроить: настройте выпадающий список в панели дизайна. На смартфонах тип списка всегда браузер.
- Браузер: используйте для выпадающего списка стиль браузера по умолчанию.
- Это поле: установите флажок Обязательное, чтобы посетители должны были выбрать элемент из этого раскрывающегося списка перед отправкой.
- Нажмите значок Макет
, чтобы настроить выравнивание текста, а также отступы и интервалы элемента. - Нажмите значок Дизайн
, чтобы выбрать готовый дизайн, затем выберите Настроить дизайн, чтобы настроить внешний вид выпадающего списка. - (Необязательно) Нажмите на значок Анимация
, чтобы добавить анимацию к выпадающему списку.
Готовы к публикации?
Нажмите Предпросмотр в правом верхнем углу редактора, чтобы протестировать новую форму. Когда все будет выглядеть отлично и работать правильно, нажмите Опубликовать, чтобы изменения вступили в силу.
Если вы включили песочницу, синхронизируйте коллекцию песочницы с опубликованной коллекцией, чтобы изменения вступили в силу.
Часто задаваемые вопросы
Нажимайте на вопросы ниже, чтобы получить ответы на наиболее распространенные вопросы о подключении выпадающих списков к CMS.
Как устранить неполадки при сохранении ответов на формы, которые не сохраняются в коллекции CMS?
Могу ли я экспортировать данные, которые будут сохранены в коллекции?
Могу ли я автоматизировать действия, которые происходят при получении отправленных форм?
Могут ли посетители сайта использовать элементы ввода для фильтрации контента, который отображается на сайте?
Можно ли отображать отправленные формы в таблице, галерее или репитере?
Как разрешить пользователям обновлять ответы посетителей?
Откуда берется список параметров, если я подключаю выпадающий элемент к полю «Ссылка»?
Как подключить несколько форм к одной коллекции CMS?