Виджет элементара гравитационных форм: добавьте и стилизуйте гравитационные формы без CSS
Гравитационные формы - это виджет Pro в главных дополнениях, который размещает любую Гравитационную форму на странице Элементора и позволяет стилизовать ее с панели. Выберите форму из раскрывающегося списка, начните с одного из 11 вариантов дизайна, затем настройте метки, поля, флажки, кнопку отправки, многостраничные индикаторы выполнения и сообщения об ошибках. Форма продолжает работать точно так же, как вы построили ее в Гравитационных формах.
11 готовых конструкций форм
Выпадающий список "Вариации дизайна" имеет 11 стилей. Выберите один в качестве отправной точки, затем измените все, что вам нравится на вкладке "Стиль". Вы также можете скрыть заголовок и описание, установленные в Gravity Forms, и вместо этого написать собственный заголовок в Elementor.
- Переключайтесь между 11 вариантами конструкции из одного раскрывающегося списка.
- Показывать или скрывать название формы, описание, метки и заполнители.
- Добавьте пользовательский заголовок и описание, не редактируя саму форму.
Стиль поля, флажка и кнопки радио
Входы и текстовые области получают фон, цвет текста, границу, радиус, тень ящика и типографику, с отдельным состоянием фокуса. Устанавливайте ширину и высоту для входов и текстовых областей независимо, плюс заполнение и отступ текста. Радиокнопки и флажки могут иметь пользовательские размеры, цвета и радиус границы для нормального и проверенного состояний.
- Нормальные состояния и состояния фокуса для полей ввода.
- Раздельная ширина и высота для входных данных и текстовых областей.
- Пользовательские стили радио и флажков, разделители разделов и цвета цен на продукцию.
Кнопка отправки, многостраничные формы и сообщения
Сделайте кнопку отправки авто, полной ширины или пользовательской ширины, затем стиль его цвета, границы, радиус, заполнение, тени коробки и типографики, с hover цветов. многостраничные формы получить стиль для кнопок страницы и бар прогресса Сообщения об ошибках, недопустимые поля и сообщение благодарности каждый имеет свои собственные настройки цвета, и вы можете скрыть сообщения об ошибках полностью.
- Автоматическая кнопка отправки полной ширины или пользовательской ширины с цветами наведения.
- Кнопка страницы и стиль индикатора выполнения для многостраничных форм.
- Цвета сообщений об ошибках, недопустимые поля и благодарственное сообщение.
Виджет Elementor Shortcode против виджета Gravity Forms
Бесплатный виджет Shortcode от Elementor также может отображать форму гравитации с помощью [gravityform id="1"]. Форма работает, но выглядит так, как ее стилизуют ваша тема и гравитационные формы, и изменение означает написание CSS.
| Виджет шорткода | Гравитационные формы Master Addons | |
|---|---|---|
| Цена | Бесплатно | Мастер Аддоны Про |
| Выбор формы | Введите идентификатор формы в коротком коде | Выберите его из раскрывающегося списка |
| Готовые конструкции | Нет | 11 вариантов дизайна |
| Стиль поля и пуговиц | Пользовательские CSS | Вкладка "Стиль" с фокусом и состояниями наведения |
| Прогресс-бар и стилистика ошибок | Пользовательские CSS | Вкладка Стиль |
| Мобильные регулировки | Медиа-запросы CSS | Адаптивный контроль размеров и расстояния |
Использование плагина другой формы? В Master Addons есть бесплатные виджеты для стилистики Контактная форма 7, WPФормы, Ниндзя Формы и weФормы.
Как добавить гравитационную форму в Элементор
Вам нужны Гравитационные Формы с хотя бы одной созданной формой, и Master Addons Pro. Затем выполните следующие действия
- Включите виджет Gravity Forms на панели управления Master Addons.
- Откройте свою страницу в Elementor, выполните поиск на панели виджетов по запросу “Gravity Forms” и перетащите виджет Master Addons на место.
- Выберите форму в раскрывающемся списке "Контактная форма".
- Выберите одну из 11 вариаций дизайна.
- Решите, показывать ли название формы, описание, метки и заполнители. включите Используйте Ajax, чтобы отправить форму без перезагрузки страницы.
- Откройте вкладку Стиль, чтобы установить цвета, границы, интервалы и типографику, затем опубликуйте.
Если раскрывающийся список пуст, проверьте, активны ли Gravity Forms и создана ли форма.
Часто задаваемые вопросы о формах гравитации
Нужен ли мне плагин Gravity Forms?
Да. стили виджета формируются в Gravity Forms, так что плагин должен быть установлен и активен. без него виджет показывает уведомление с просьбой активировать Gravity Forms.
Как добавить гравитационную форму в Элементор?
Установите Gravity Forms и создайте свою форму.В Elementor перетащите виджет Master Addons Gravity Forms на страницу, выберите форму в раскрывающемся списке Контактная форма, выберите вариант дизайна и создайте стиль на вкладке Стиль пошаговое руководство выше охватывает каждую настройку.
Могу ли я сделать формы отзывчивыми на мобильных устройствах?
Да. многие элементы управления размером, интервалом и выравниванием имеют отдельные значения для рабочего стола, планшета и мобильного телефона, поэтому вы можете изменять заполнение, ширину поля и ширину кнопки для экранов меньшего размера.
Будут ли еще работать дополнения условной логики и Gravity Forms?
Да. виджет выводит вашу форму через сами Gravity Forms, поэтому условная логика, многостраничные формы и дополнения работают так, как вы их настраиваете. виджет только меняет внешний вид формы.
Виджеты и расширения трендовых элементов
Создавайте сложные веб-сайты за меньшее время.
Стекломорфизм
Дополнительные контейнеры
Шаблоны
Дубликатор сообщений/страниц
