Вызов конструктора (или редактора) форм обратной связи Chronoforms 6 осуществляется из панели управления компонентом.

Окно редактирования включает всего четыре раздела:

  1. «Настройки» (Settings) — глобальные настройки, обеспечивающие автоматический ренденеринг и функционирование проекта в целом.
  2. «Страницы» (Pages) — вкладка, представляющая собой визуальный конструктор, где осуществляется непосредственное редактирование приложения путем размещения, настройки или удаления представлений или функций формы.
  3. «Перевод» (Translate) — инструмент локализации формы, с помощью которого осуществляется языковой перевод ее клиентской части для отображения на мультиязычном сайте.
  4. «Управление доступом» (Access control) — раздел, который отвечает за настройку разрешений клиентской части формы в отношении всех групп пользователей.

Раздел «Настройки» (Settings) в редакторе Chronoforms 6

Раздел «Настройки» (Settings) в редакторе Chronoforms 6 состоит из двух частей — «Общие настройки» (Basic) и «Дополнительно» (Advanced).

Интерфейс конструктора форм Chronoforms 6

Рис. 1

  • «Общие настройки» (Basic):
    1. «Заголовок» (Title) — название формы. Могут использоваться как кириллические, так и латинские символы, а также пробельные.
    2. «Алиас» (Alias) — алиас, являющийся уникальным идентификатором формы. Не должен содержать кириллических, пробельных или спецсимволов. Автоматически генерируется из заголовка. В связи с чем, если заголовок указан на кириллице, то значение в поле «Алиас» необходимо поменять на правильное. Алиас используется для вызова формы с помощью меню сайта, в модуле и с помощью кода вставки.
    3. «Опубликовано» (Published) — переключатель статуса публикации формы. Если его отключить, форма отображаться на сайте не будет.
    4. «Доступ Public» (Publick) — переключатель доступа «Public» для клиентской части формы. Действует аналогично полю, описанному в п. 3. Если установить его в положение «Отключено», то клиентская часть формы также не будет отображаться на сайте.
    5. «Описание» (Description) — многострочное поле для ввода текста описания формы.
  • «Дополнительно» (Advanced):
    1. «Тип приложения» (App Type) — тип создаваемого или редактируемого проекта, где возможность выбора предоставлена в двух вариантах — «Форма» (Form) и «Пользовательский» (Custom). Тип «Пользовательский» исключает подгрузку основных скриптов, обычно используемых формами по умолчанию при загрузке страницы. Поэтому, для большинства приложений рекомендуется оставить значение этого поля как есть, в положении «Форма».
    2. «Следовать порядку страниц» (Follow page order) — переключатель порядка обработки многостраничной формы. В CF6 подавляющее большинство форм являются многостраничными, т. к. «load» и «submit» — также представлены в конструкторе в виде страниц (они могут быть не видны на странице сайта, если не содержат какие-либо видимые объекты, но в клиентской части мы всегда видим результаты их работы). При этом данные для формы также предоставляются пользователем в ходе заполнения полей в определенном порядке, соответствующем их порядку в конструкторе. В большинстве случаев этот переключатель рекомендуется оставлять в положении «Включено».
    3. «Мультистраничная форма» (Multi page form) — многостраничная форма (см. п. 7). Данные страниц обрабатываются автоматически, доступны на всех страницах формы и очищаются после обработки ее последней страницы, если в настройках отдельных страниц и представлений не указано обратное.
    4. «Использовать AJAX» (Use AJAX) — отвечает за возможность использования AJAX-технологии для предотвращения перезагрузки страницы сайта после отправки формы. Эта опция отключена по умолчанию, но ее можно включить сразу здесь или же при настройке соответствующих представлений или функций-обработчиков.
    5. «Включить валидацию на стороне сервера» (Enable server validations) — включение или отключение автоматической серверной проверки полей формы, содержащих правила или пользовательские ограничения. Эту опцию также можно устанавливать не сразу, а подключать в ходе настройки представлений или функций формы.
    6. «Проверка полей безопасности» (Check security fields) — включение или отключение автопроверки полей безопасности, таких как reCaptcha, security image, honeypot. Можно включить как в разделе «Настройки» (Settings), так и с помощью соответствующих функций.
    7. «Загрузка файлов» (Upload files) — автозагрузка файлов из полей типа «File field», в настройках которых, а также в функции «Email», она тоже должна быть включена.
    8. «Лог данных» (Log data) — включение ведения логов (содержатся в таблице логов chronoforms в БД сайта).
    9. «Отладка» (Debug) — включение отладчиков на всех страницах проекта.
    10. «Включить разрешения» (Enable permissions) — включение или отключение управления доступом для проекта. Если эта опция включена, то в конструкторе появляется еще один объект редактирования (раздел) — «Управление доступом» (Access control). Форма должна быть сохранена нажатием на кнопку «Полное сохранение» (Full save), чтобы данные изменения вступили в силу.
    11. «Загрузить страницу по умолчанию при отсутствии формы» (Load default page if non found) — включение или отключение показа дефолтных страниц сайта для случаев отключения (удаления) или отсутствия прав доступа к форме (например, страницы 404 или 403).

Раздел «Страницы» (Pages) в конструкторе Chronoforms 6

Раздел «Страницы» (Pages) в конструкторе Chronoforms 6 — это самый большой и универсализированный раздел редактирования формы. В более ранних версиях CF6 его функционал был распределен между вкладками «Дизайнер» (Designer) и «Настройка» (Setup), содержимое которых обрабатывалось компонентом как отдельные объекты. В версиях 6.1.x и визуальные элементы, и функции были сведены в один объект редактирования — страницу, которая теперь, независимо от того, является ли страницей формы или же событием, включает в себя все, следующие категории:

  1. «Представления» (Views), где осуществляется установка и настройка визуальных элементов — полей ввода, элементов дизайна формы и т. д.
  2. «Функции» (Actions), где производится установка и настройка функционала представлений (см. п. 1)
  3. «Настройки» (Settings) — та часть глобальных опций (отображение, отладка, тип страницы), для которых есть возможность индивидуализации в рамках редактирования отдельной страницы.
  4. «Предпросмотр» (Preview) — вкладка просмотра и тестирования содержимого отдельной страницы.
  5. «Шаблон» (Template) — вкладка, где определяется порядок генерации html-кода страницы.
  6. «Разрешения» (Permissions) — упревление доступом различных групп пользователей к содержимому этой страницы. Эта вкладка будет отсутствовать, если в дополнительных настройках формы была отключена опция «Включить разрешения» (Enable permissions) (см. п. 15 на рис. 1).

При создании новой формы автоматически генерируются две страницы — «load» и «submit». Они же являются событиями. И каждая из них содержит шесть вкладок с названиями, соответствующими вышеописанным пунктам. Названия вкладок, находятся на верхней панели управления каждой страницей, где кроме них, первым слева указано имя страницы, а также есть небольшая панель инструментов в правом верхнем углу с кнопками «Свернуть/Развернуть», «Переместить» и «Удалить».

В конструкторе используется технология «Drag&Drop», поэтому большинство операций по добавлению, перемещению, удалению осуществляются с помощью мыши.

Вкладка «Представления» (Views)

Используется для создания клиентской части формы. Этой вкладке соответствует свой репозиторий визуальных элементов (слева), который недоступен для использования на всех прочих вкладках.

При нажатии на «Представления» (Views), на эту вкладку автоматически переключаются все страницы проекта.

Вкладка «Представления» (Views) раздела «Страницы» (Pages) в конструкторе Chronoforms 6

Рис. 2

  1. «Ядро» (Core) — стандартные поля и элементы дизайна, разделенные на группы «Fields», «Advanced Fields», «Security Fields», «Areas», «Widgets», «Custom» и «Lists». Каждая из них содержит по набору из нескольких элементов, чье назначение и определяется названием группы.
  2. «Ещё…» (More…) — набор всех имеющихся опубликованных блоков с типом «views», созданных пользователем в «Менеджере блоков». Подробнее об этом можно прочесть здесь.
  3. Тело страницы (или область) — место для формирования визуальной части страницы формы путем размещения в нем элементов из репозитория и их настройки.
  4. Поле добавления новой страницы представляет собой связку из инпута, куда вводится имя страницы и кнопки «+ Страница» (+ Page), которая становится активной при вводе первых символов имени.
  5. Кнопка «Свернуть / Развернуть» — первый значок панели справа зеленого цвета, разворачивает и сворачивает содержимое страницы по высоте.
  6. Кнопка «Переместить» — второй значок панели справа желтого цвета, удерживая который можно менять страницы местами. То же касается и любых элементов формы, на панелях редактирования которыми он расположен.
  7. Кнопка «Удалить» — третий значок на панели справа красного цвета служит для удаления страниц. Осторожно! При удалении конструктор не требует подтверждения и, если форма была сохранена, вернуть удаленную страницу не удастся. То же касается и всех визуальных элементов, размещаемых на форме.

Вкладка «Функции» (Actions)

Служит для создания и настройки функционала формы, который, как правило, работает на стороне сервера. Этой вкладке соответствует свой репозиторий визуальных элементов (слева), который недоступен в других вкладках.

При нажатии на «Функции» (Actions), на эту вкладку автоматически переключаются все страницы проекта.

Вкладка «Функции» (Actions) раздела «Страницы» (Pages) в конструкторе Chronoforms 6

Рис. 3

1. «Ядро» (Core) — стандартные функции, разделенные на группы «Basic», «Database», «Files», «Joomla», «Logic», «Payments», «Security» и «Services». Каждая из них содержит по набору из нескольких визуальных элементов, чье назначение и определяется названием группы.

2. «Ещё…» (More…) — набор всех имеющихся опубликованных блоков с типом «functions», созданных пользователем в «Менеджере блоков».

3. Тело обработчика (или область) — тело пользовательской функции, осуществляющей обработку формы наряду с основным обработчиком. Визуально представляет собой место для создания функционала формы путем размещения там элементов из репозитория, их настройки, добавления дополнительного js, php, css или html-кода.

Вкладка «Настройки» (Settings)

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

Вкладка «Настройки» (Settings) раздела «Страницы» (Pages) в конструкторе Chronoforms 6

Рис. 4

  1. «Автоматический просмотр представления» (Auto display view). Если этот переключатель находится в положении «Включено», то страница с указанным именем будет отображена автоматически, т. е. без использования дополнительных функций (таких как «Display Layout», например).
  2. «Отладка» (Debug) — включение отладчика, информация которого будет отображена после обработки события с указанным именем (имя страницы).
  3. «Тип страницы» (Page type) — переключатель, предоставляющий три варианта выбора типа страницы многостраничной формы: «Auto» — страница отображается в соответствие с порядком ее следования в конструкторе, т. е. после предыдущей; «Standalone» — отображаемая страница не будет принимать или передавать вызовы с других страниц, а будет функционировать автономно; «End» — на этой странице обработка формы будет полностью завершена, следующие за ней страницы обрабатываться не будут. Если вы не знаете, что делаете, лучше оставить это поле как есть, т. е. с типом страницы «Auto».

Вкладка «Предпросмотр» (Preview)

При переключении на эту вкладку одной страницы, вкладки всех остальных останутся в прежнем положении.

Здесь выводится для просмотра клиентская часть формы, т. е. то, что можно непосредственно видеть или с чем можно взаимодействовать на сайте (см. п.1 на рис. 5). Если на странице нет визуальных элементов, то и область ее предпросмотра останется пустой (см. п. 2 на рис. 5).

Вкладка «Предпросмотр» (Preview) раздела «Страницы» (Pages) в конструкторе Chronoforms 6

Рис. 5

Вкладка «Шаблон» (Template)

В этой вкладке можно просматривать, редактировать и устанавливать порядок генерации html-кода формы.

Вкладка «Шаблон» (Template) раздела «Страницы» (Pages) в конструкторе Chronoforms 6

Рис. 6

  1. «Автогенерация шаблона при сохранении формы» (Autogenerate page template when form is saved) — порядок генерации шаблона. Если эта опция отключена, то html-код страницы можно будет менять только вручную. Рекомендуется оставить этот переключатель в положении «Включено».
  2. «Шаблон» (Template) — текущий html-код указанной страницы.

Вкладка «Разрешения» (Permissions)

Вкладка управления доступом различных групп пользователей к странице с указанным именем. Содержит древовидный список групп, для которых устанавливаются разрешения, во многом похожий на список групп в панели управления Joomla. Эта вкладка появляется как для страницы, так и в редакторах настроек всех, расположенных на ней элементов, только в том случае, если в общем разделе формы «Настройки» (Settings), включена опция «Включить разрешения» (Enable permissions) (см. п. 15 на рис. 1).

Вкладка «Разрешения» (Permissions) раздела «Страницы» (Pages) в конструкторе Chronoforms 6

Рис. 7

  1. «Значение ID владельца» (Owner id value) — идентификатор пользователя, взятый из «Менеджера пользователей» Joomla для того, кому разрешен индивидуальный доступ ко всей странице или ее элементам. Это может быть не только «Super User» но и абсолютно любой, отдельно взятый пользователь.
  2. Список разрешений, включающий четыре стандартных варианта: «inherited» — унаследовано, «Allowed» — разрешено, «Denied» — запрещено и «Banned» — бан. Подробнее об этом можно прочесть здесь.

Раздел «Перевод» (Translate) в конструкторе Chronoforms 6

Раздел «Перевод» (Translate) в конструкторе Chronoforms 6 представляет собой локализатор для работы с текстовыми элементами всего проекта. С его помощью можно переводить клиентскую часть формы на все, поддерживаемые Joomla языки. Именно посредством механизмов Joomla будет осуществляться переключение между языками на сайте.

Подробнее о локализации форм обратной связи можно прочесть здесь.

Раздел «Перевод» (Translate) в конструкторе Chronoforms 6

Рис. 8

  1. Список всех локализаций. Локализация en_GB создается по умолчанию. Хотя бы одна локализация должна быть на форме всегда, т. е. если она одна, то недоступна для удаления.
  2. «Добавить локализацию» (Add locale) — поле для добавление новой локализации. Обязательно должны использоваться стандартные языковые теги.
  3. «Имя» (Name) — имя текущей, отображаемой локализации.
  4. «Контент» (Content) — поле, где осуществляется непосредственное создание или редактирование языкового перевода формы.

Раздел «Управление доступом» (Access control) в конструкторе Chronoforms 6

Раздел «Управление доступом» (Access control) в конструкторе Chronoforms 6 также, как и в случае со вкладкой «Разрешения» раздела «Страницы», представляет собой древовидный список групп пользователей, для которых устанавливаются права. Только в отличии от предыдущего, это права на весь проект, поэтому поле «Владелец» здесь отсутствует (см. рис. 9).

Раздел «Управление доступом» (Access control) в конструкторе Chronoforms 6

Рис. 9