Тільки користувачам дозволено входити в центр адміністрування. Вхід

Форми - Впливаючі вікна

Мои формыДобавить формуФорми - Впливаючі вікнаВпливаючі вікна?



Результат (span элемент):



Укажите параметры для всплывающего окна:

ID Формы Необходимо создать форму
Class для оформления кнопки Заголовок окна Текст кнопки закрытия окна
(отображается только если указано значение)
Текст кнопки `Отправить` Текст ссылки/кнопки открытия окна Ширина окна Высота окна Зафиксировать заголовок окна Автоматическая ширина и высота Автоматическая ширина и высота имеет больший приоритет чем изначальное значение ширины и высоты Автоматическая ширина окна (значение указывает минимальную возможную ширину) Автоматическая высота окна (значение указывает минимальную возможную высоту) Минимальная ширина и высота Вы можете ограничить максимальный развер окна, даже если используете автоматическую ширину и высоту. Минимальная ширина окна Минимальная высота окна Ширина мобильного окна
(если окно меньше указанного размера, то для него устанавливается указанное значение ширины)
Дополинелеьные параметры Примечание о форме
примечание о заявке, добавляется в статистику продаж.
Функциональные названия содержат предопределённый набор скрываемых полей. Несколько функциональных названий:
  • `Callback`- Обратный звонок. Выполняется скрытие дополнительных полей. Остаются только `Имя` и `Номер телефона`. Дополнительно можно добавить параметр `data-dialog-productid` с идентификатором просматриваемого товара.
  • `Consultation` - Задать вопрос. Выполняется скрытие поля с комментарием. Добавляется текст над формой `Введите ваши контактные данные, мы с вами свяжемся и ответим на все вопросы.`. Дополнительно рекомендуется добавить параметр `data-dialog-productid` с идентификатором просматриваемого товара.
  • `Ask price` - Узнать цену. Выполняется скрытие поля с комментарием. Дополнительно рекомендуется добавить параметр `data-dialog-productid` с идентификатором просматриваемого товара.
  • `Quick order` - Быстрый заказ. Выполняется скрытие поля с комментарием, e-mail и телефоном. Дополнительно рекомендуется добавить параметр `data-dialog-productid` с идентификатором просматриваемого товара.

Вы можете указать собственные примечания, а скрывающиеся поля указать при помощи параметра `data-dialog-form-hide-fields`.
Скрыть поля
Скрыть елементы в форме (список, разделитель `|`).
  Готово   В конструкторе не указаны дополнительные поля: data-dialog-productid, data-dialog-product_num, data-dialog-varietyid, data-dialog-formprice, data-dialog-modify-text, data-dialog-form-autosubmit, data-dialog-form-required-class, data-dialog-form-autosubmit-replace-class, data-dialog-form-required-class-alert; Данные поля можно использовать для автозаполнения формы, передачи стоимости или идентификатора товара, указать обязательнные для заполнения поля, а также всплыващие замечания при их отсутствии. Инструкция находится ниже.



Инструкция:


Пример кода кнопок для вслывающих форм:

<div class="hotengine-form-constructor" data-dialog-form_id="XXX" data-dialog-width="370" data-dialog-height="280" data-dialog-form_title="Callback" data-dialog-title="Заказать обратный звонок" data-dialog-whatform="Форма заказать обратный звонок с кнопки в ... сайта" data-dialog-buttontext="Відправити">Зворотний дзвінок</div>

<div class="hotengine-form-constructor" data-dialog-form_id="XXX" data-dialog-width="370" data-dialog-height="490" data-dialog-form_title="Задати питання" data-dialog-title="Задати питання" data-dialog-whatform="Форма Задать вопрос с кнопки в ... сайта" data-dialog-buttontext="Відправити">Задати питання</div>


Изменяя или дополняя следующие значения, при отправке формы, будут указаны соответствующие данные.
Данные необходимо указывать у кнопок, вызывающих всплывающие окошки.
  • "data-dialog-form_id" - ID формы
  • "data-dialog-width" - ширина всплывающего окна
  • "data-dialog-height" - высота всплывающего окна
  • "data-dialog-title" - заголовок диалогового окна
  • "data-dialog-form_title" - примечание о заявке, добавляется в статистику продаж
  • "data-dialog-whatform" - с какой формы заявка (положение или свои данные)
  • "data-dialog-productid" - ID товара, если заявка о конкретном продукте.
  • "data-dialog-product_num" - количество добавляемого товара, если заявка о конкретном продукте.
  • "data-dialog-varietyid" - разновидность товара, если заявка о конкретном продукте.
  • "data-dialog-formprice" - цена заявки или товара
  • "data-dialog-buttontext" - текст кнопки внутри окна
  • "data-dialog-modify-text" - автозамена текста заявки (комментария). Используется для отправки дополнительной информации, которую можно предваритиельно сформировать с помощью Javascript.
  • "data-close-button" - текст кнопки закрытия окна (отображается только если указано значение)
  • "data-dialog-form-hide-fields" - Скрыть елементы в форме (список, разделитель `|`)
  • Дополнительные параметры (автозаполнение формы):
    • "data-dialog-form-autosubmit" - 1-включить
    • "data-dialog-form-required-class" - обязательные поля для заполнения (список, разделитель `|`) (**)
    • "data-dialog-form-autosubmit-replace-class" - (список, разделитель `|`) (***)
    • "data-dialog-form-required-class-alert" - сообщения об ошибке если не заполнено поле data-dialog-form-required-class (**) (список, разделитель `|`)

    • *** - Например значения полей data-dialog-form-required-class (**) будут перезаписаны найденными значениями на странице, элементами из списка data-dialog-form-autosubmit-replace-class (***).
      Если поля data-dialog-form-required-class (**) не заполнены, то всплывает сообщение указанное в поле data-dialog-form-required-class-alert.
      Данная функция полезна в том случае, когда вы хотите создать поле для заполнения, при нажатии на которое будет всплывать форма и сразу отправляться с заменой данных из созданного ранее поля.

Пример кода - hotengine-script-forms-popup.js

Мои формыНазад