Форма обратной связи php modx. Как сделать форму обратной связи в ModX Revolution с помощью FormIt

Для создания формы на Modx без спама, надо её создать с дополнительными невидимыми полями:

1. Загружаем и устанавливаем компоненты Ajaxform и Formit

2. Форма вызывается очень просто, вы должны разобраться

[[!AjaxForm? &snippet=`FormIt` &form=`tpl.AjaxForm..ru ` &emailTo=`info@сайт` &validate=`name:required,email:required,message:required,work-email:blank` &validationErrorMessage=`В форме содержатся ошибки!` &successMessage=`Спасибо за заявку! Мы свяжемся с вами в ближайшее время.` &emailTpl=`mailtpl` ]]

Или через шабланизатор Fenom, вот так:

{$_modx->runSnippet("!AjaxForm", [ "snippet" => "FormIt", "form" => "tpl.AjaxForm.example", "hooks" => "email,spam" "emailFrom" => "[email protected]", "emailSubject" => "Заявка с сайта daruse.ru", "emailTo" => "[email protected]", "validate" => "name:required,email:required,message:required,work-email:blank", "validationErrorMessage" => "В форме содержатся ошибки!", "successMessage" => "Спасибо за заявку! Мы свяжемся с вами в ближайшее время.", "emailTpl" => "mailtpl", ])}

Описание параметров:

snippet - сниппет для обработки AjaxForm, ставим Formit - он как раз и отправляет письма
form - чанк оформления формы, стоит тот, который по умолчанию
hooks - хуки для защиты от спама
emailFrom - адрес, от которого приходит письмо
emailTo - адрес, которому приходит письмо
validate - валидация, тут также два невидимых поля
validationErrorMessage - сообщение, которые будет выводиться, при не успешном вводе полей
successMessage - сообщение, которые будет выводиться, при успешной отправке письма
emailTpl - чанк, в котором храниться шаблон приходящего письма на почту (о нём читайте ниже)

3. После этого заходим в наш чанк оформления формы, в данном случае это tpl.AjaxForm.example и добавим после тега form, следующие два поля.

...

Теперь по Вашей форме не должен проходить спам, за счет двух новых полей.

4. Внешней вид приходящего письма

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

Шаблон письма это простой чанк, который мы указываем в параметре emailTpl , тут всё очень просто, напишу пример оформления. Если будут вопросы, пишите в комментариях.

mailtpl:

На сайте [[++site_url]] оставили заявку.

[[+name:notempty=`

Имя: [[+name]]

`]] [[+email:notempty=`

Почта: [[+email]]

`]] [[+message:notempty=`

Сообщение: [[+message]]

`]]

Пожалуйста свяжитесь с ним в ближайшее время.

Не отвечайте на это письмо, так как оно автоматическое.

Читайте о создании и c защитой от спама.

Добрый день! Сегодня я познакомлю вас с созданием формы обратной связи для Modx Revolution, фишкой которой будет необычная каптча (так как гугловская qaptcha слишком сложная и громоздкая). Делать обратную связь мы будем с помощью дополнения Formit. Установить вы его сможете, наверное, сами, ну а для тех, кто не знает как это сделать я все таки распишу урок от начала до конца. Начинаем!

Пропущу все моменты связанные с установкой MODX Revolution, настройкой системы, встраивание дизайна сайта и так далее. Начнем с установки пакета Formit.

1. Заходим в Система - Управление пакетами

2. Жмем "Загрузить дополнения"

3. Выбираем из списка Formit

Жмем "загрузить". После загрузки Formit у вас появиться в загруженных пакетах, жмем кнопку установить. Formit установлен!

4. Далее создаем новый чанк

Назовем его "form", и вставляем следующий код:

[[!Qaptcha]] [[!FormIt?&hooks=`spam,email,redirect` &emailTpl=`sentEmailTpl` &emailSubject=`Заявка на обратный звонок` &emailTo=`ваш электронный почтовый адрес` &redirectTo=`id страницы "Письмо успешно отправлено"` &validate=`contact_name:required,contact_phone_NA_format:required` &customValidators=`qaptcha.Slider`]] Имя\Компания* Телефон* E-mail [[+qaptcha.Slider]]

Здесь сам вызов сниппета Formit, форма и каптча, которую мы заставим работать в следующих пунктах. Не забываем в параметре emailTo указать почтовый ящик, на которое должно приходить письмо, а в redirectTo нужно поставить id страницы "Письмо успешно отправлено"

5. Создаем чанк sentEmailTpl

Он будет говорить, какую информацию отсылать на почту и вставляем туда код:

Имя: [[+contact_name]]
Email: [[+contact_email]]
Телефон: [[+contact_phone_NA_format]]
Примечание: [[+contact_message]]

6. Создаем новый документ под названием "Письмо успешно отправлено"

В содержимое ресурса можно вставить текст типа: Мы получили ваше письмо! Спасибо за выбор нашей компании. Наш менеджер в кратчайшие сроки свяжется с Вами по контактному телефону, который Вы оставили в заявке!

7. Теперь займемся самой Каптчей

Подключаем на страницу бибилотеку jquery:

8. Создаем каталоги assets/components/qaptcha/ и core/components/qaptcha/

В каталог assets/components/qaptcha/ помещаем папку images и jquery с содержимым, а в core/components/qaptcha/ - папку php с файлом Qaptcha.jquery