Статьи

Избавьтесь от формообразования с помощью JotForm 4.0

Август 21, 2018

Эта статья была спонсирована JotForm . Спасибо за поддержку партнеров, которые делают возможным использование SitePoint.

HTML-формы — проклятие жизни веб-разработчиков. Они редко бывают захватывающими, их легко ошибиться и они подвергаются многочисленным пересмотрам со стороны клиентов и руководителей. Не могли бы вы позволить им напрямую редактировать код, когда даже самые простые формы требуют знания:

  1. Типы ввода HTML5.
  2. Поддержка браузера и варианты отката.
  3. Код проверки как на клиенте, так и на сервере.
  4. При необходимости настраиваемые элементы управления с использованием HTML, CSS и JavaScript.
  5. Спам и методы обнаружения мошенничества.
  6. Серверная обработка и хранение данных.
  7. Интеграция со сторонними системами, такими как электронная почта, аналитика, CRM, платежные шлюзы и т. Д.
  8. Пользовательская отчетность.
  9. Тестирование на различных настольных и мобильных устройствах.

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

Или это?

Новый и улучшенный JotForm

Я рассмотрел JotForm 3.0 в январе 2015 года . Онлайн-приложение позволяет сторонним разработчикам создавать и редактировать сложные формы сбора данных с использованием интерфейса WYSIWYG. Вы добавляете поля, выбираете тему, изменяете цветовую схему, определяете параметры интеграции, публикуете, ждете ответов и просматриваете отчеты.

JotForm 3.0 был отличным решением, но последний выпуск пошел еще дальше, предоставляя нетехническим пользователям интуитивно понятные инструменты для создания форм любой сложности.

JotForm 4.0

JotForm 4.0 только что был выпущен, и я рад сообщить, что он решает проблему сложности. Интерфейс был переработан и стал более привлекательным и интуитивно понятным, чем раньше. Опции легко доступны, но скрыты, пока они вам не понадобятся.

Интерфейс JotForm 4.0]

Поля формы и виджеты

Ссылка « Добавить элемент формы» ведет к выдвижной панели, которая содержит заголовки и основные поля формы, такие как электронная почта, имена, телефон, указатели даты, номера, раскрывающиеся списки, загрузка файлов, кнопки и многое другое.

JotForm 4.0 основные поля формы

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

На вкладке « Виджеты » представлен, казалось бы, бесконечный (но доступный для поиска) список пользовательских элементов, таких как вкладки форм, слайдеры, видео YouTube и т. Д.

Виджеты JotForm 4.0

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

Свойства поля JotForm 4.0

Настройки формы

На вкладке НАСТРОЙКИ отображаются параметры формы, такие как имя, предупреждающие сообщения и даже языковые переводы.

Панель « Условия» позволяет создавать простую условную логику, например показывать другое поле при вводе определенного значения. Условия могут также выполнять вычисления, включать или отключать обязательные поля, пропускать или скрывать страницы, изменять страницу «спасибо» или изменять адрес электронной почты.

Полевые условия JotForm 4.0

Панель « Интеграции» предоставляет возможности для сторонней интеграции с несколькими десятками популярных онлайн-провайдеров, включая Google Docs, Dropbox, MailChimp, Campaign Monitor, Sales Force, Highrise и Braintree. Мастер выполняет процедуру аутентификации с помощью сервиса и выполняет такие действия, как добавление пользователя в список рассылки:

JotForm 4.0 сторонняя интеграция

Формы Темы и Стили

Нажмите значок ролика на вкладке BUILD, чтобы получить доступ к конструктору форм. Вкладка ЦВЕТА позволяет вам установить стандартные цвета и изображения:

JotForm 4.0 цвета формы

Это дополняется вкладкой СТИЛИ для управления шириной формы, выравниванием, шрифтами и интервалом. Вкладка CSS позволяет вводить пользовательский код. Вы также можете получить доступ к расширенному редактору CSS, который открывает новое приложение для редактирования отдельных свойств с использованием элементов управления или кода.

Если это звучит как слишком много усилий, перейдите на вкладку ТЕМЫ и выберите заранее разработанную привлекательную тему:

JotForm 4.0 темы

Предварительный просмотр формы

Ваша форма может быть просмотрена и использована в любое время. Полезная кнопка Fill Form добавит фиктивные данные во все поля:

Предварительный просмотр формы JotForm 4.0

Форма публикации

Как только ваш шедевр закончен, вы можете перейти по его уникальному URL:

Публикация форм JotForm 4.0

Доступен ряд других опций:

  • встроить форму на страницу с помощью одного тега HTML- script
  • скачать исходный код и скопировать его на свою страницу
  • поместите форму в iframe
  • используйте настраиваемую кнопку «обратная связь», чтобы открыть форму
  • используйте кнопку, чтобы открыть форму в лайтбоксе
  • откройте форму во всплывающем окне
  • Скопируйте встроенный код для популярных CMS и систем, таких как WordPress, Joomla, Drupal, Facebook, Weebly, Shopify, PrestaShop, Magento и SharePoint.

Новые особенности

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

JotForm также позволяет вам получить доступ к списку ревизий и вернуться к предыдущему редактированию одним щелчком мыши.

Наконец, несколько членов команды могут работать в одной форме одновременно. Ваши изменения автоматически применяются ко всем остальным.

Резюме

JotForm 4.0 — это радикальная перестройка системы проектирования форм, которая была первоначально запущена в 2006 году. Я твердолобый программист и редко люблю WYSIWYG-редакторы, но JotForm — это удовольствие от использования и экономит значительное время. Это особенно быстро, когда вам не нужно изучать стороннюю документацию по API при интеграции других систем.

Основные преимущества JotForm 4.0:

  • более простой, приятный и удобный интерфейс дизайна форм
  • полностью настраиваемый дизайн
  • привлекательные готовые темы
  • сотни стандартных и пользовательских полей
  • условная логика без программирования
  • может использоваться на настольных или мобильных устройствах
  • мгновенное сохранение с автономной обработкой и синхронизацией
  • сотрудничество с коллегами в режиме реального времени
  • сторонняя интеграция с десятками провайдеров
  • прост в использовании, встраивать в веб-страницы или публиковать формы в Интернете
  • бесплатный стартовый план

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

Попробуйте JotForm сегодня и создавайте формы где угодно и когда угодно.

38
Share: