Документация по использованию простых полей типа text, email и .д. в плагине Frontend Code-Form Builder. По остальным полям будут созданы отдельные посты с документацией. Общие настройки полей опишу только для одного поля "text", вы можете применять их и для других полей. Даны все возможные настройки для этого поля. Все настройки этого поля применимы к большинству других полей плагина. [ //Тип поля (обязательное) 'type' => 'text', //Имя поля, латинские буквы или цифры, нижнее подчеркивание или тире, обязательное поле 'id' => 'name', //Подсказка 'placeholder' => 'Укажите название', //Минимальная длина поля, используется при клиентской валидации 'min' => 5, //Максимальная длина поля, используется при клиентской валидации 'max' => 200, //Значение поля по умолчанию 'def' => 'Детская игрушка Мишка', //стиль отображения, по умолчанию 1. /* Варианты отображения поля: 1 - название поля сверху, required слева от названия, tooltip справа сразу после названия. 2 - название поля слева, required с
Документация по использованию простых полей типа text, email и .д. в плагине Frontend Code-Form Builder. По остальным полям будут созданы отдельные посты с документацией.
Общие настройки полей опишу только для одного поля "text", вы можете применять их и для других полей.
Тип поля text
Даны все возможные настройки для этого поля. Все настройки этого поля применимы к большинству других полей плагина.
[
//Тип поля (обязательное)
'type' => 'text',
//Имя поля, латинские буквы или цифры, нижнее подчеркивание или тире, обязательное поле
'id' => 'name',
//Подсказка
'placeholder' => 'Укажите название',
//Минимальная длина поля, используется при клиентской валидации
'min' => 5,
//Максимальная длина поля, используется при клиентской валидации
'max' => 200,
//Значение поля по умолчанию
'def' => 'Детская игрушка Мишка',
//стиль отображения, по умолчанию 1.
/*
Варианты отображения поля:
1 - название поля сверху, required слева от названия, tooltip справа сразу после названия.
2 - название поля слева, required слева от названия, tooltip справа сразу после названия. На мобильном переход в стиль 1. тоесть название сверху.
3 - без названия и без отступа, required - слева от поля, tooltip - нет
4 - название поля сверху, при этом самого названия нет, но остается отступ сверху, required - слева от поля, tooltip - нет/
5 - анимация перехода placeholder в label для однострочных полей типа text, select, ....
*/
'sw' => 1,
//Ширина внутреннего контейнера поля, по умолчанию 100%.
'wi' => '100%',
//Ширина внешнего контейнера поля или контейнера, по умолчанию 60%
'ww' => '55%',
//название поля
'label' => 'Название',
//Обязательное поле
'required' => true,
//Принудительный перенос сверху. По умолчанию все поля выстраиваются в горизонтальную линию друг за другом, чтобы сделать перенос, используйте эту настройку.
'tb' => true,
//Принудительный перенос снизу. Аналогично настройке выше.
'bb' => true,
//Произвольный класс внешнего контейнера поля
'class' => 'class-name',
//Текст всплывающей подсказки. Для использования в конфиге нужно подключить скрипт tooltip.
'tooltip' => 'Текст всплывающей подсказки',
//Текст подсказки под полем
'help' => 'Текст подсказки под полем',
//Текст до поля
'before' => 'Текст до',
//Текст после поля
'after' => 'Текст после',
//Не сбрасывать поле в случае сброса/восстановления исходного состояния всей формы. true или false. Работает совместно с настройкой формы reset_template.
'no_reset' => false,
//Массив произвольных атрибутов для внешнего контейнера поля
'attributes_wrapper' => [],
//Кнопка открыть закрыть поле. актуально только для настройки "sw" со значением "1".
/*
Если не указано - кнопки нет и поле всегда открытое
1 - поле изначально открытое, при перезагрузке состояние сохраняется в куках. при перезагрузке состояние сохраняется если есть заполненные поля
2 - поле изначально скрытое, при перезагрузке состояние сохраняется в куках. при перезагрузке состояние сохраняется если есть заполненные поля
3 - поле изначально открытое, при перезагрузке состояние сохраняется в куках. при перезагрузке поле всегда открывается если есть заполненные поля
4 - поле изначально скрытое, при перезагрузке состояние сохраняется в куках. при перезагрузке поле всегда открывается если есть заполненные поля
во всех случаях поле будет открытое если в момент отправки формы есть ошибки заполнения
*/
'slide' =>1,
//Дополнительная настройка для "slide". Сколько дней сохранить состояние поля (свернуто/развернуто), 0 - не сохранять и cookie не устанавливаются. По умолчанию отключено.
//Имена cookie: fcfb_slide_*
'remember_state' => 30,
//Условная логика. Варианты действий: показать/скрыть, отключить/включить, запретить редактировать/разрешить, обязательное поле/не обязательное, произвольное действие. (hide, disabled, readonly, required, addaction).
'conditions' => [],
//Копировать текст поля
'copy' => true,
//Очистить текст поля
'clear' => true
]
textarea - многострочный текст
Для этого поля применимы все те же настройки, как и для поля text. Далее будут описаны только специальные для этого поля настройки.
[
'type' => 'textarea',
'id' => 'desc',
'label' => 'Описание товара',
'ww' => '100',
//Высота поля в строках
'rows' => 10
]
Принимает точно такие же настройки как и поле text.
[
'type' => 'email',
'id' => 'email',
'label' => 'E-mail компании',
]
password
[
'type' => 'password',
'id' => 'password',
'label' => 'Пароль',
//Минимальная длина пароля. По умолчанию 6
'min' => 5,
//Максимальная длина пароля. По умолчанию 15
'max' => 10,
//символы в пароле
'charset' => '@#$&*()_+-=,./?abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789',
]
number - число с кнопками + и -
[
'type' => 'number',
'id' => 'number',
'label' => 'Количество товаров',
//Включить или отключить кнопки +-
'control' => true,
//Минимальное число
'min' => 5,
//Максимальная число
'max' => 10,
//Шаг
'step' => 1,
]
color
Для работы этого поля, в конфиге формы необходимо подключить скрипт 'vanilla-picker'.
[
'type' => 'color',
'id' => 'color',
'label' => 'Цвет товара',
]
hidden - скрытое поле
[
'type' => 'hidden',
'id' => 'hidden',
//Значение поля
'value' => 'значение',
]
url
[
'type' => 'url',
'id' => 'site',
'placeholder' => 'https:// ',
'label' => 'Сайт компании',
]
checkbox
[
'type' => 'checkbox',
'label' => 'Согласен с условиями',
'id' => 'agreement',
//Текст после чекбокса
'after' => 'Да',
]
Тип поля toggle - чекбокс в виде переключателя
[
'type' => 'toggle',
'label' => 'Согласен с условиями',
'id' => 'agreement2',
//Текст после чекбокса
'after' => 'Да',
]
submit - кнопка отправки формы
[
'type' => 'submit',
'id' => 'submit',
//Текст на кнопке
'name' => 'Отправить',
//Текст ожидания при отправке формы
'wait' => 'Подождите...',
]
reset - очистка формы
Для работоспособности этой кнопки в настройках формы необходимо указать reset_template = true
[
'type' => 'reset',
'id' => 'reset',
//Текст на кнопке
'name' => 'Очистить форму',
]
range - одиночный ползунок
[
'type' => 'range',
'id' => 'price',
'label' => 'Цена',
//кнопка очистки поля
'clear' => true,
//Минимальное значение
'min' => 0,
//Максимальное значение
'max' => 100,
//склонение числительных. массив ['рубль','рубля','рублей']
'unit' => ['рубль', 'рубля', 'рублей'],
//когда вызвать событие change. По умолчанию когда отпустили мышку.
'change' => 'mouseup', //mousemove - при перемещении, mouseup - по завершению перетаскивания
//бесконечность. если указать число, то при установке ползунка больше чем максимум в value будет это значения, а названии поля символ бесконечности
'infinity' => 101,
//шаг
'step' => 1,
//исключить указанные числа в массиве (например в диапазоне от 0 до 10 исключить 4 и 7)
'exclude' => [2, 3],
]
ranges - двойной ползунок для установки диапазона
[
'type' => 'ranges',
'id' => 'rarges',
'label' => 'Диапазон',
'min' => 0,
'max' => 100,
]
wp_editor - классический редактор текста с загрузкой картинок
[
'type' => 'wp_editor',
'id' => 'editor',
'label' => 'Редактор текста',
'ww' => '100%',
'rows' => 5,
// Управляющие флаги
'media_buttons' => true,
// Явный флаг wpautop (влияет и на PHP-форматирование, и на TinyMCE)
'wpautop' => true,
// TinyMCE (дефолт), синхронизируем wpautop
'tinymce' => [
'wpautop' => 'wpautop',
'toolbar1' => 'formatselect,bold,italic,bullist,numlist,code,blockquote,alignleft,aligncenter,alignright,link,unlink,spellchecker',
'toolbar2' => 'strikethrough,hr,forecolor,removeformat,charmap,outdent,indent,undo,redo',
'menubar' => false,
'statusbar' => true,
'resize' => true,
'elementpath' => true,
],
// Quicktags
'quicktags' => [
'buttons' => 'strong,em,link,block,del,ins,img,ul,ol,li,code',
],
]
html - произвольный контент
[
'type' => 'html',
'id' => 'content',
//Тип форматирования. Варианты: safe_formatted/safe_raw/the_content
'render_mode' => 'render_mode',
'html' => 'html код',
]
rating - рейтинг звездами
Также можно указать свои иконки
[
'type' => 'rating',
'id' => 'rating',
'label' => 'Рейтинг',
//Максимальная оценка
'max' => 5,
// Иконка
'icon' => '★',
]
multirating - множественный рейтинг по параметрам
[
'type' => 'multirating',
'id' => 'multirating',
'label' => 'Рейтинг по параметрам',
//Максимальная оценка
'max' => 5,
// Иконка
'icon' => '★',
// Критерии оценки
'criteria' => [
[
'name' => 'Скорость',
'slug' => 'speed',
'icon' => '★',
'max' => '10',
],
[
'name' => 'Качество',
'slug' => 'quality',
'icon' => '✓',
'max' => '2',
],
[
'name' => 'Надежность',
'slug' => 'reliability',
'icon' => '•',
'max' => '5',
],
],
]
math_captcha - математическая каптча
[
'type' => 'math_captcha',
'id' => 'code',
'label' => 'Ответ на вопрос',
//Сложность
'difficulty' => 'medium', // easy, medium, hard
]