Размещение формы на сайте — Заявки для Webasyst

Форму можно поставить на сайт четырьмя способами. Все они работают одновременно: одну и ту же форму можно вывести на странице и открывать в модальном окне по кнопке.

1. Встроенная форма в шаблоне

Самый короткий путь. В разделе Формы у каждой строки есть готовый хелпер — скопируйте его в шаблон темы:

{$wa->requests->renderForm(1)}

Число — номер формы. Форма встанет со своими стилями и скриптами.

Если стили и скрипты нужно подключить отдельно — например, собрать все стили в одном месте страницы:

<link rel="stylesheet" href="{requestsViewHelper::getCss()}">
{requestsViewHelper::form($form_id)}
<script src="{requestsViewHelper::getJs()}"></script>

2. Модальное окно

Форма открывается поверх страницы:

{requestsViewHelper::renderModal($form_id)}

Так выводится кнопка по умолчанию, которая эту модалку открывает. Если кнопка своя, скройте стандартную и укажите свой триггер:

{requestsViewHelper::renderModal($form_id, ['trigger' => '.my-button', 'show_button' => false])}

3. Своя кнопка или ссылка

Любой элемент с атрибутом data-requests-modal открывает модалку — шаблон при этом править не нужно:

<button data-requests-modal="1">Открыть форму</button>
<a href="#" data-requests-modal="1">Заказать звонок</a>

Значение атрибута — номер формы.

4. Плавающая кнопка

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

Ссылка с хэшем

Отдельно от четырёх способов: модалку открывает адрес с хэшем. Такую ссылку можно положить в письмо, в меню темы или в кнопку чужого блока — туда, куда свой атрибут не поставить.

<a href="#requests-modal-1">Заказать звонок</a>

Подробно, вместе со своим хэшем вместо служебного, — в статье «Модальное окно».

Что ещё есть в настройках

Ширина модального окна задаётся настройкой формы. Если тема передаёт свою ширину параметром при вызове, побеждает параметр темы, а не настройка: у темы больше контекста о том, куда встаёт окно.

«Отключить CSS» — переключатель для случая, когда форму оформляет сама тема. Приложение перестаёт подключать свои стили, и форма наследует оформление страницы целиком. Включайте, только если в теме есть стили под форму: без них она станет набором неоформленных полей.