Быстрый старт

Для быстрого старта достаточно вызвать единственный сниппет FetchIt указав в параметре form в качестве значения название вашего чанка.

Важно!

Сниппет должен быть вызван некэшированным, т.е. перед его названием должен быть восклицательный знак.

modx

[[!FetchIt?
  &snippet=`FormIt`
  &form=`myForm.tpl`
  &hooks=`email`
  &emailSubject=`Тема письма`
  &emailTo=`info@domain.com`
  &validate=`name:required,email:required`
  &validationErrorMessage=`В форме содержатся ошибки!`
  &successMessage=`Сообщение успешно отправлено`
]]

fenom

{'!FetchIt' | snippet : [
  'snippet' => 'FormIt',
  'form' => 'myForm.tpl',
  'hooks' => 'email',
  'emailSubject' => 'Тема письма',
  'emailTo' => 'info@domain.com',
  'validate' => 'name:required,email:required',
  'validationErrorMessage' => 'В форме содержатся ошибки!',
  'successMessage' => 'Сообщение успешно отправлено',
]}

Допустим, что форма в вашей вёрстке выглядит так:

<form action="#" method="post">
  <input type="text" name="name" placeholder="Ваше имя">
  <span class="input-error"></span>

  <input type="email" name="email" placeholder="E-mail">
  <span class="input-error"></span>

  <button type="submit">Отправить</button>
</form>

Минимальное что вам нужно сделать это добавить дата атрибут data-error со значением совпадающим с названием поля, элементам которые будут отображены в случае, если они не пройдут валидацию.

Остальное на ваш вкус и цвет.

myForm.tpl

<form action="[[~[[*id]]]]" method="post">
  <input type="text" name="name" placeholder="Ваше имя" value="[[+fi.name]]">
  <span class="input-error" data-error="name">[[+fi.error.name]]</span>

  <input type="email" name="email" placeholder="E-mail" value="[[+fi.email]]">
  <span class="input-error" data-error="email">[[+fi.error.email]]</span>

  <button type="submit">Отправить</button>
</form>