Категорії: Огляди plugin WordPress

Створюйте та створюйте форми за допомогою віджета Elementor Form

На кожному сайті має бути контактна форма! Контактні форми корисні для різноманітних цілей, незалежно від типу вашого веб-сайту. Вони можуть залучати потенційних клієнтів, налагоджувати зв’язки та стосунки, дозволяти користувачам повідомляти про проблеми з вашим сайтом і все, що між ними.

Щоб створити контактні форми в WordPress, не обов’язково бути технічним експертом. За допомогою конструктора сторінок Elementor створювати красиві веб-сайти стало легше, ніж будь-коли.

Щоб продемонструвати, як створювати контактні форми в Elementor, ми розглянемо різні варіанти та все, що потрібно знати про контактні форми в Elementor.

Elementor вже досить давно включає віджет Form, що означає, що вам більше не потрібно нікуди йти, щоб створити форми для свого веб-сайту WordPress, і це справжнє благо!

У минулому ви могли стикатися з труднощами під час створення форм за допомогою деяких доступних plugin . Процес проектування та налаштування форм може зайняти багато часу та викликати розчарування. На щастя для всіх нас, з віджетом Elementor Form легко працювати.

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

Для початку одна з найвідмітніших особливостей полягає в тому, що він повністю інтегрований в інтерфейс Elementor, що означає, що ви маєте доступ до багатьох варіантів дизайну/стилю/макета, доступних у Elementor. Я не вірю, що ви знайдете автономний plugin форми з такою ж надійною системою дизайну, як ця.

Звідти ви можете створити до 18 різних типів полів:

  • Текстова електронна пошта Текстова область Текстова область
  • URL-адреса та номер телефону:
  • Перемикачі є різновидом перемикачів.
  • Виберіть зі списку (спадне меню)
  • Прапорці використовуються в контрольних списках.
  • Є лише один прапорець (прийняття)
  • reCAPTCHA
  • Honeypots – це тип контейнера, який містить мед (захищає від спаму)

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

Elementor Pro має понад 12 інтеграцій із популярними службами маркетингу електронною поштою та системами керування взаємовідносинами з клієнтами, щоб допомогти вам максимально використати свої форми. Існує також інтеграція Zapier, яка дозволяє підключатися до будь-якого з тисяч інструментів, доступних на платформі Zapier, якщо ваш інструмент відсутній у списку.

Є також кілька інших інтригуючих альтернатив. amp , коли хтось заповнює вашу форму, ви можете отримувати сповіщення через Slack або Discord.

Говорячи про сповіщення, ви також можете персоналізувати сповіщення електронною поштою, які ви отримуєте, і сповіщення електронною поштою, які отримують відправники форм. Коли вони надішлють форму, ви можете перенаправити їх на спеціальну сторінку подяки, яку ви створите.

Який найкращий спосіб створити форму в Elementor?

Ми почнемо з того, що відкриємо редактор Elementor, а потім перетягнемо віджет Form у місце, де ми хочемо створити нашу форму.

Як створити форму Elementor

Як і все інше в Elementor, процес створення форм здійснюється візуально. Немає необхідності використовувати додатковий plugin , а також не обов’язково виступати в якості серверної частини вашого веб-сайту.

Формування елементів Elementor структурованим способом

Коли ваша форма готова, першим кроком є ​​впорядкування інформації, що міститься в ній. Які поля вам потрібні та яких типів полів вони повинні мати? Що ти шукаєш?

Під час роботи в редакторі Elementor поля форми додаються та редагуються на вкладці «Вміст», як ви можете бачити в amp нижче, форми містять кілька полів за замовчуванням. Вибравши «Додати елемент» у спадному меню, ви можете створити нові поля.

Дублювати поле також можна, вибравши піктограму, яка виглядає як два документи, один перед іншим, і клацнувши на ній. 

Типи полів у формі

Доступно багато типів полів форми, від простих текстових полів до паролів, ReCaptcha та полів honeypot.

Щоб змінити поведінку поля форми, спочатку виберіть поле, а потім натисніть спадне меню «Тип», щоб переглянути доступні різні типи полів.

Типи полів у формі Elementor

Ширина стовпця форми

Ця функція дозволяє використовувати два поля форми в одному рядку, налаштувавши параметр «Ширина стовпця». Змініть ширину вікна, вибравши його зі спадного списку та вибравши 50 відсотків. Варто зазначити, що якщо ви зробите це з двома послідовними полями форми, ви помітите, що вони з’являються в одному рядку разом.

Форми в Elementor для стилізації

Стилізуйте свої форми в Elementor так само, як і інші віджети, перейшовши на панель «Стиль», розташовану в інтерфейсі редагування Elementor.

Саму форму, поля, кнопки, будь-які кроки, повідомлення про помилки та повідомлення підтвердження можна налаштувати.

Для тих, хто вже знайомий з Elementor, їм не так багато чого потрібно вивчати у стилізації форм Elementor.

Дії над формою

Після нашого обговорення створення форми в Elementor, давайте розглянемо налаштування того, що відбувається після надсилання вашої форми; це досягається за допомогою дій форми або, як вони називаються в Elementor, дій після надсилання.

Коли форма надсилається, система зазвичай надсилає електронний лист і перенаправляє користувача на іншу веб-сторінку. Ви, звичайно, можете включити скільки завгодно дій у свої форми та комбінувати їх будь-яким способом. Як і слід було очікувати, існує спеціальне поле вибору без кодування.

Кожна з доданих вами дій відображатиметься як окрема вкладка в головному меню. Зараз у нас є опція вкладки для електронної пошти, але якби я включив переспрямування в поле «Додати дію», я б також побачив перенаправлення в параметрах вкладки, як показано в amp нижче.

На завершення я покажу, як налаштувати Форму для прийому повідомлень електронною поштою, запитання про Форми, яке найчастіше задають.

Коли ви вибираєте Електронна пошта на вкладці «Вміст» у редакторі, ви побачите екран, показаний нижче; тут ви можете персоналізувати електронну пошту з електронної пошти та електронну пошту для відповіді, а також можете додати копію або приховану копію для будь-кого, хто має отримати копію подання з форми.

Створення шаблону повідомлень контактної форми в Elementor

Багато людей були здивовані, дізнавшись, що редактор форм Elementor потужніший, ніж здається на перший погляд, і однією з розширених функцій є можливість налаштовувати повідомлення для кожної форми.

Можна налаштувати повідомлення форми, щоб надати кінцевому користувачеві, який заповнив вашу форму, більш персоналізований процес зворотного зв’язку, а не звучати як нудний робот. Але, зокрема, які повідомлення ви можете налаштувати для своєї контактної форми Elementor:

Для початку вам потрібно спочатку ввімкнути користувацькі повідомлення, вибравши «Додаткові параметри» зі спадного меню, а потім перемкнувши перемикач «Настроювані повідомлення» на «Так».

Налаштування віджета контактної форми Elementor шляхом додавання спеціальних повідомлень

Як бачите, є чотири різні повідомлення, які можна налаштувати, включно з наведеними нижче:

Повідомлення про успіх відображається кінцевому користувачеві після надсилання форми та перевірки правильності заповнення форми (наприклад, відсутність пропущених обов’язкових полів тощо).

Повідомлення про помилку — повідомлення, яке відображається кінцевому користувачеві, коли під час подання форми виникає невідома помилка.

Обов’язкове повідомлення — з’являється, коли необхідне поле форми не заповнено, форму подано, але вона не заповнена.

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

Можливість редагувати повідомлення дозволяє вам бути креативними та оригінальними, або більш офіційними та діловими, якщо ви керуєте корпоративним сайтом. Найкраща частина полягає в тому, що їх можна повністю редагувати, тому ви можете робити все, що забажаєте!

Висновок

Віджет форми Elementor, створити контактну форму легко. Він поставляється з інтуїтивно зрозумілим конструктором контактних форм із функцією перетягування та безліччю параметрів налаштування, які відрізняють його від інших plugin для контактних форм, доступних на ринку. Ви можете легко налаштувати його стиль і колірну схему відповідно до зовнішнього вигляду вашої компанії. Також включено різні інші привабливі віджети, понад 300 професійних шаблонів і конструктор спливаючих вікон в одному зручному пакеті. Цей повнофункціональний конструктор сторінок WordPress містить усі необхідні віджети та функції, тому вам не доведеться купувати додаткові конструктори сторінок, щоб налаштувати свій веб-сайт. Крім того, він дозволяє інтегрувати понад 30 маркетингових служб, тому це один із найпопулярніших plugin на ринку сьогодні.

Хенсон Ф.

Останні повідомлення

Як використовувати верхні та нижні колонтитули з Elementor

Верхні та нижні колонтитули веб-сайту є важливими елементами. У більшості випадків заголовок забезпечує навігацію…

6 січня 2022 р

Порівняння тем WordPress: Astra проти OceanWP

Дві найпопулярніші теми WordPress на ринку – Astra та OceanWP. Професійний…

2 січня 2022 р

Порівняння тем новин WordPress: Газета проти. Астра

Щоб створити чудовий сайт новин, не обов’язково ставати веб-дизайнером. Ми…

25 жовтня 2021 р

Створіть веб-сайт, пов’язаний із новинами, із газетною темою

Тема газети є однією з найважливіших тем WordPress, розроблена tagDiv,…

18 жовтня 2021 р

Як створити електронну комерцію за допомогою Avada WooCommerce Builder

Коли справа доходить до створення онлайн-магазину, WooCommerce є plugin для переходу. Це…

4 жовтня 2021 р

Як використовувати липкий заголовок і ефекти прокручування з Elementor

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

21 вересня 2021 р