Наверх

Простые отзывы на сайте AjaxForm (Formit) + MIGX

В разделе «Репосты» расположены чужие статьи, которые мне понравились или показались полезными.

Создание отзывов на сайте без использования платных дополнений или громоздких, таких как Tickets.
Нам понадобятся следующие дополнения: Formit, AjaxForm и если хочется защитить форму — recaptchav3.

Данная статья будет полезна новичкам в modx и ни на что не претендует.


1) Создание ресурса «Отзывы», Конфигурация MIGX и создание TV поля.
1.1) Создайте ресурс «Отзывы» желательно с отдельным шаблоном «Отзывы».
1.2) Теперь создайте конфигурацию MIGX. Для этого Нужно зайти в «Пакеты» — «MIGX» и добавить конфигурацию. Например, назовите ее reviews. (!!! запомните название, оно понадобится на шаге 1.3)


На вкладке Formtabs нажмите «Добавить элемент» и далее добавьте 4 поля:
name — Имя, text — Текст отзыва, phone — Телефон, published — Публиковать отзыв.
При добавлении поля published в поле Input TV Type нужно вписать checkbox, а на вкладке Input Options в поле Input Option Values написать Да==1. Тем самым поле получится в виде галочки.



На вкладке Columns так же добавьте эти поля, но у поля published на вкладке Render, в поле Render выберете this.renderCrossTick, что бы это поле отображалось в виде галочки.

1.3 Теперь создайте ТВ поле с названием «reviews» и подписью «Список отзывов». На вкладке «Параметры ввода» выберите «migx», а в поле «Конфигурация» введите название конфигурации, созданной в пункте 1.2), в нашем случае reviews. На вкладке «Доступно для шаблонов» выберите наш шаблон «Отзывы».

Теперь если у вас оставят отзыв они будут храниться в данном ТВ-поле у этого ресурса.


2) Форма для добавления отзывов.
В шаблоне «Отзывы» в нужном вам месте добавьте вызов AjaxForm:
Обычный синтаксис modx
[[!AjaxForm?
&rcv3Action=`reviews-action`
&snippet=`FormIt`
&hooks=`rcv3,addReview,email`
&form=`form.review`
&emailFrom=`[[++emailsender]]`
&emailSubject=`Новый отзыв на сайте [[++site_name]]`
&emailTo=`ВАШ ЕМЕЙЛ`
&emailTpl=`tpl.review`
&successMessage=`<h5>Ваш отзыв добавлен</h5><p>После проверки администратором он будет опубликован.</p>`
&validate=`name:required:russian,text:required`
&validationErrorMessage=`В форме содержатся ошибки!`
&customValidators=`russian`
]]

Fenom
{'!AjaxForm' | snippet : [
    'rcv3Action' => 'reviews-action',
    'snippet' => 'FormIt',
    'hooks' => 'rcv3,addReview,email',
    'form' => 'form.review',
    'emailFrom' => $_modx->config.emailsender,
    'emailSubject' => 'Новый отзыв на сайте ' ~ $_modx->config.site_name,
    'emailTo' => 'ВАШ ЕМЕЙЛ',
    'emailTpl' => 'tpl.review',
    'successMessage' => '<h5>Ваш отзыв добавлен</h5><p>После проверки администратором он будет опубликован.</p>',
    'validate' => 'name:required:russian,text:required',
    'validationErrorMessage' => 'В форме содержатся ошибки!',
    
    'customValidators' => 'russian',
]}


Разберем некоторые параметры:
rcv3Action — Уникальное значение на всем сайте. Необходим при использовании Рекапчи.

hooks
rcv3 — проверка на робота
addReview — наш сниппет, который добавляет отзыв в ТВ-поле «Список отзывов». О нем ниже
email — отправляет Администратору письмо о новом отзыве.

form — чанк, который содержит код формы. Пример:
<form action="{$_modx->resource.id | url}" method="post" novalidate>
    <div class="form-group">
        <input type="text" name="name" class="form-control" placeholder="Ваше имя">
        <span class="error_name"></span>
    </div>
        	
    <div class="form-group">
        <input type="tel" name="phone" class="form-control" placeholder="Ваш телефон (не публикуется)" pattern="\d*" novalidate>
        <span class="error_phone"></span>
    </div>
    
    <div class="form-group">
        <textarea name="text" placeholder="Текст отзыва" class="form-control"></textarea>
        <span class="error_text"></span>
    </div>

    <button type="submit" class="btn btn-primary btn-red">Отправить</button>
    
    {'!rcv3_html' | snippet : [
        'action' => $rcv3Action,
        'error' => $_modx->getPlaceholder('fi.error.g-recaptcha-response'),
    ]}
</form>

Источник: modx.pro/lessons/23193


0 комментариев

    Авторизация

    через сервис Loginza:


    Шаблоны MODX

    1 2 Дальше »

    Объектная
    модель
    MODX