Плагин распространяется по принципу "As Is", "как есть". Поддержка оказывается индивидуально, на основе запросов. Возможна платная и бесплатная поддержка – все зависит от ситуации. Разумные предложения в чате Telegtram или Max могут быть реализованы. Все согласуется с автором.

• Как вывести форму обратной связи на экран?
• Что нужно настроить после установки плагина?
• Имена полей и перевод на нужный вам язык
• Что обозначают Javascript #1, Javascript #2 и Javascript #3? Зачем они нужны?
• Всплывающие окна
• Javascript #0. Код, который вызывается перед отправкой формы
• Как изменить сообщение, которое появляется после отправки формы?
• Как задать индивидуальное сообщение, которое появляется после отправки для каждой формы?
• Достижение целей в Яндекс Метрике
• Тема письма
• Индивидуальная тема письма для каждой формы
• Выбор адресата формы
• Имя поля "Ответить на"
• Обязательные поля и валидация HTML5 полей формы
• Тексты ошибок для неверно заполненных полей
• Поля со множественными значениями (checkbox и select multiple)
• Сообщения "Подождите"
• Отправка фотографий и других разрешенных вложений
• Настройка телеграм
• Переопределение шаблона писем
• Интеграция с сервисом Jivosite
• Свой кастомный php код
• Расширение функциональности за счет создания своих плагинов
• Интеграция с Bitrix24 CRM
• Интеграция с AmoCRM

Примечание: не забудьте назначить атрибут name для тега input! Иначе ничего работать не будет!

Выглядит это так (можно нажимать):

Класс required предназначен для обозначения обязательных полей. Если это поле будет не заполнено - плагин ему назначит css класс, который предназначен для отображения неверно заполненных полей. Этот класс естественно можно менять в настройках плагина.

Попробуйте нажать кнопку отправки формы, не заполнив поле с телефоном - форма ввода станет красной. Впрочем, здесь пространство для фантазии огромное - можете настроить как угодно.

Надеюсь, идея плагина теперь должна быть вам ясна. Для новичков, которым незнакомы теги HTML эта форма скорее всего не подойдет (хотя я планирую выпустить в дальнейшем уже готовые формы обратной связи под разные шаблоны). Вам будет достаточно их просто скопировать. Для тех, у кого возникают проблемы с копированием - лучше не использовать эту форму.

Что нужно настроить после установки плагина?

Обязательно укажите email, куда должна отсылаться почта плагином. Укажите CSS классы для неверно заполненных полей в соответствии с вашим шаблоном. Если используется yootheme - можно оставить как есть. Класс uk-animation-shake помогает визуально выделить незаполненные поля. Настройте код Javascript #2 для того, чтобы определить что должен делать плагин после успешной отправки формы. По умолчанию стоит alert(rfMessage), но это не очень хорошо. Для шаблонов на основе UIKit хорошо подойдет UIkit.modal.alert(rfMessage);

Имена полей и перевод на нужный вам язык

В самом письме имена полей будут теми же самыми, которые были указаны в атрибуте name тега input. Конечно для конечного пользователя сайта это не очень хорошо. В плагине предусмотрена возможность переопределить имена, которые будут фигурировать в самом письме. Для этого достаточно воспользоваться стандартным механизмом Joomla для переопределения языковых констант.

Например, если у вас поле ввода выглядит так:

<input class="uk-input required" name="phone" placeholder="Введите свой номер телефона..." type="text">

То вам достаточно перейти в раздел "Языки -> переопределение констант" и создать новую константу PHONE.

Если вы хотите, чтобы перевод языковой константы отображался не только в письмах и отправленных сообщениях, но и в логах админки сайта, лучше поставить галочку "Для сайта и панели".

Тогда перевод ваших языковых переменных отобразится и в истории отправленных сообщений в настройках плагина.

Что обозначают Javascript #1, Javascript #2 и Javascript #3? Зачем они нужны?

В настройках плагина есть поля, обозначенные как Javascript #1, Javascript #2 и Javascript #3. По умолчанию после отправки формы вызывается код скрипта #2. При первоначальной установке плагина в коде Javascript #2 стоит просто alert(rfMessage). Этот код можно поменять на тот, который вам больше подходит. Для тем на основе yootheme pro можно прописать UIkit.modal.alert(rfMessage);

Каждый из скриптов при вызове получает текст сообщения с именем rfMessage и ссылку на кнопку, которая была нажата для отправки формы с именем here .

Зачем это нужно?

Всплывающие окна

Предположим, вам требуется закрыть то всплывающее окно, которое было открыто для вывода формы. Например, на сайте есть кнопка "Заказать обратный звонок". Ее нажали и было выведено модальное окно с формой обратной связи. Человек ее заполнил и нажал кнопку "заказать".

Нужно чтобы всплывающее окно было закрыто и затем выведено сообщение "Сообщение отослано".

Задаем код для Javascript #1

UIkit.modal(document.querySelector("#callback")).hide();

А в саму кнопку отправки формы добавляем такой параметр: data-rf-call="12" , который обозначает, что после отправки формы обратной связи нужно вызвать Javascript #1, а затем Javascript #2.

Итого, сама кнопка отправки заявки примет вот такой вид:

<button class="uk-button uk-button-primary rf-button-send" data-rf-call="12">Отправить заявку</button>

Так как внутри каждого окошка можно вставить сколько угодно команд Javascript, то по идее 3 окошек со скриптами должно хватать. Но если понадобится — пишите - расширим хоть до 9.

Javascript #0. Код, который вызывается перед отправкой формы

Эту форму обратной связи можно удобно использовать в любом интернет магазине в качестве кнопки "Купить в один клик". Для того чтобы форма могла передать название товара или его артикул, требуется выполнить дополнительный код, который исполняется перед отправкой формы. Его можно разместить в окошке с названием Javascript #0 и вызвать с помощью параметра data-rf-call="02".

Давайте рассмотрим небольшой пример, который заполняет скрытое поле artikul значением артикула текущей страницы магазина Hikashop. Однако вы можете модифицировать код по своему усмотрению.

Итак, добавим в окошко Javascript #0 такой скрипт:

var art = document.querySelector("#hikashop_product_code_main").textContent; here.insertAdjacentHTML('afterend', '<input name="artikul" value="'+art+'" type="hidden">');

Этот код добавит в поля формы еще одно поле с нашим артикулом товара.

Еще раз напомню — не забудьте указать параметр data-rf-call="02" в кнопке отправки:

  <button class="rf-button-send uk-button" data-rf-call="02" >Send</button>

Аналогичным образом можно получить и другие параметры товара.

Если нужно предотвратить отправку формы, можно использовать возвращение значения false при исполнении Javascript #0.

return false;

Как изменить сообщение, которое появляется после отправки формы?

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

Как задать индивидуальное сообщение, которое появляется после отправки для каждой формы?

Если нужно индивидуальное сообщение для каждой формы — используйте механизм индивидуальных ява-скриптов. При вызове Javascript #2 можно задать свое сообщение или дополнительную логику, которая будет выводить нужное вам сообщение. Можно для каждой формы выбрать свой ява скрипт с индивидуально заданным текстом. Или же можно генерировать сообщение на основе имени формы или страницы. Можно добавить скрытое поле и выводить сообщение из него. Одним словом — пространство для маневра и возможность задать нужные параметры ничем не ограничены!

Давайте рассмотрим такой вариант подробнее.

Предположим, что мы хотим для одной формы выводить сообщение "Мы вам перезвоним" вместо "Ваше сообщение отправлено".

Как это сделать?

Задаем Javascript #3:

UIkit.modal.alert("Мы вам перезвоним");

Затем для кнопки отправки задайте параметр data-rf-call="3"

В результате кнопка будет выглядеть так:

<button class="uk-button uk-button-primary rf-button-send" data-rf-call="3">Отправить заявку</button>

Ну вот и все. После отправки формы будет вызван яваскрипт #3, который и выведет указанное сообщение.

Если вам нужно чтобы для каждой формы можно было передавать индивидуальное сообщение - можно немного изменить яваскрипт #3 таким образом, чтобы он считывал например параметр data в кнопке, в котором можно будет передать сообщение.

UIkit.modal.alert( String(here.dataset.rfText));

Теперь если в кнопку добавить такой параметр - data-rf-Text, то в нем можно указать индивидуальную тему для каждой формы:

<button class="uk-button uk-button-primary rf-button-send"
data-rf-text="Мы вам перезвоним" data-rf-call="3">Отправить заявку</button>

Достижение целей в Яндекс Метрике

После вызова скрипта для вывода на экран сообщения об отправке, можно вставить код цели Яндекс Метрики.

Например так:

UIkit.modal.alert(rfMessage);    ym(XXXXXXX, 'reachGoal', 'ZAKAZ');

Вместо XXXXXXX поставьте номер своего счетчика Яндекс метрики.

Тема письма

Все отправляемые сообщения имеют одну тему, которая прописывается в параметрах плагина. Ее можно поменять на тот текст, который подходит именно вам.

Дополнительно в тему письма можно вставить текст любого поля формы — для этого нужно заключить его в фигурные скобки.

Например, вы хотите, чтобы в теме письма присутствовал номер телефона заказчика.

Тогда тема письма должна выглядеть так:

"Заказ на сайте. Телефон: {phone}"

Здесь phone — это атрибут name одного из ваших полей ввода. Например, такого:

<input name="phone"  type="text">

Можно вставить столько полей в тему письма сколько вам понадобится. Любая комбинация будет работать. Если поля в переданной форме не будет - то подмена не производится.

Индивидуальная тема письма для каждой формы

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

Код будет выглядеть примерно так:

<input name="rfSubject" value="Заказ часов" type="hidden">

Вместо "Заказ часов" — пропишите свою тему. В индивидуальной теме письма тоже можно подставлять свои поля - замена будет работать. То есть если вы хотите чтобы в вашей теме присутствовало одно из полей формы, то (например phone), то достаточно добавить {phone} в саму тему.

Помимо темы письма можно задавать и адресатов формы обратной связи.

Выбор адресата формы

Давайте представим такую ситуацию — заказ звонка на сайте надо передавать маркетологу, а вот форму обратной связи для тех поддержки - в отдел технической поддержки.

Или скажем связь с отделом доставки и отделом продаж. Одним словом, часто на сайте (а то и на одной странице) может возникнуть ситуация, когда нужно разные формы отправлять по разным адресам.

Для того чтобы выбрать адреса предназначено скрыто поле rfTarget.

Например, вот такое поле выберет адресата с идентификатором 3:

<input name="rfTarget" value="3" type="hidden">

Сами адресаты задаются в списке альтернативных адресов Email и chat ID телеграм.

Обратите внимание, что если вам нужно, чтобы осуществлялась отправка нескольким адресатам с одной формы нужно им указать одинаковый TargetID.

Имя поля "Ответить на"

Это поле, которое позволяет очень сильно упростить общение с клиентом.

Давайте представим ситуацию, когда клиент заполнил форму и указал в ней свой email. Заполненную форму на ваш E-mail пришлет ваш сервер. Если попытаться ответить на это письмо — его получит ваш сервер. Этот факт не всегда сразу понятен администратору сайта, да и не очень удобен в работе. Значительно удобнее, если будет возможность просто ответить на это письмо и в качестве адресата уже будет выбран тот E-mail, который указал клиент, который заполнил форму.

Именно для этого и предназначена данная настройка.

Выберите имя поля, которое будет использоваться как адрес для ответа на письмо, если администратор нажмёт «Ответить»

Если вы в качестве поля для E-mail выбираете name="email", то можете ничего не менять в настройках — все уже сделано за вас.

Обязательные поля и валидация HTML5 полей формы

Плагин позволяет либо использовать встроенную валидацию полей HTML5, либо предоставляет возможность указывать поля, которые должны быть заполнены в обязательном порядке с помощью CSS класса. Эти поля должны иметь класс CSS required. Если эти поля не будут заполнены и пользователь попытается нажать кнопку "Отправить", то всем незаполненным полям будет назначен тот класс, который прописан в настройках плагина («CSS класс для невалидных полей»).

Если вы воспользуетесь валидацией HTML5, то с ее помощью можно задавать более сложные условия правильности заполнения полей. Например, можно указать, что в поле должны содержаться только числа.

<input class="uk-input" name="skolko" placeholder="Сколько коробок?" pattern="\d+" required="" type="text">

В принципе, можете использовать любые шаблоны HTML5 — плагин проверяет только их валидность на основе того, что сообщает браузер. Слишком сильно увлекаться не стоит — помните о том, что не все новомодные поля корректно поддерживаются браузерами.

Если поле не проходит валидацию, форма отправлена не будет и те поля, которые не прошли валидацию, получат классы CSS, которые указаны в настройках плагина в поле «CSS класс для невалидных полей»

В качестве классов для таких полей может использоваться несколько классов одновременно, разделенных пробелом. Для тем на основе yootheme я советую использовать два класса — uk-form-danger и uk-animation-shake.

Если вы используете другой шаблон (не на основе UIKit), то вот определение класса, которое позволяет визуально выделить незаполненные или неверно заполненные поля.

@keyframes uk-shake {
 0%, 100% { transform: translateX(0); }
 10% { transform: translateX(-9px); }
 20% { transform: translateX(8px); }
 30% { transform: translateX(-7px); }
 40% { transform: translateX(6px); }
 50% { transform: translateX(-5px); }
 60% { transform: translateX(4px); }
 70% { transform: translateX(-3px); }
 80% { transform: translateX(2px); }
 90% { transform: translateX(-1px); }
}


textarea.uk-form-danger,
input.uk-form-danger {
 border-color: red;
 animation-duration: .5s;
 animation-timing-function: ease-out;
 animation-fill-mode: both;
 animation-name: uk-shake;
}

Тексты ошибок для неверно заполненных полей

После того как в плагине появилась возможность использования валидации HTML5 полей формы, которые могут использовать сложные шаблоны проверки правильности заполненных значений, остро встал вопрос о том, как выводить индивидуальные сообщения об ошибках для каждого поля.

На самом деле решение уже давно существует и находится в рамках использования классов CSS.

Давайте рассмотрим на конкретном примере — вот форма, которая используется для заказа нескольких ящиков продукции:

<form class="uk-form-stacked">
    <div class="uk-margin">
        <input class="uk-input " name="email" placeholder="Ваш Email..." required
                type="email">
        <div class="tm-error">Заполните правильно E-mail</div>
    </div>
    <div class="uk-margin">
        <input class="uk-input " name="skolko" placeholder="Сколько коробок нужно?"
               pattern="\d+" required="" type="text">
        <div class="tm-error">Укажите число ящиков</div>
    </div>
    <div class="uk-margin">
        <input class="uk-input" name="address" placeholder="Адрес доставки или самовывоз" type="text">
    </div>
    <div class="uk-margin-medium-top">
        <button class="uk-button uk-button-primary rf-button-send uk-width-1-1">Отправить заявку
        </button>
    </div>
    <input name="rfSubject" value="Заказ на сайте" type="hidden">
</form>

Вот как эта форма выглядит в работе:

Здесь присутствуют два обязательных поля (email и количество ящиков продукции), которые помечены атрибутом required (не путайте с именем CSS поля!).

Первое поле имеет тип E-mail. Значения, не соответствующие корректному формату e-mail, не пройдут валидацию.

Второе поле имеет стандартный тип text, но в него добавлен паттерн, который указывает, что правильным значением будет только числовое значение. Пользователь не сможет отправить форму с неверно заполненными полями.

Для того чтобы пользователю было понятнее, что не так с его значениями — выводятся пояснения.

Как это было сделано?

Если какое-то поле не проходит валидацию, скрипт добавляет ему тот класс, который вы указали в настройках RadicalForm – он называется «CSS класс для невалидных полей». В нашем примере я указал там значение uk-form-danger. Именно этот класс будет добавлен к каждому невалидному полю. Основываясь на этом факте, мы можем добавить необходимые правила CSS.

После каждого поля мы добавили тег <div> с классом CSS tm-error. Затем мы добавили следующие классы в CSS файл нашего сайта:

.uk-form-danger + .tm-error {
    display: block;
}
.tm-error {
    position: absolute;
    font-size: 12px;
    color: darkred;
    display: none;
}

Эти правила позволяют скрыть сообщения в нормальном состоянии и показать их тогда, когда поле получит класс uk-form-danger, т.е. тогда, когда будет понятно, что поле не прошло валидацию.

Обратите внимание, что в HTML5 вводятся новые псевдоклассы для невалидных полей – :invalid и их можно использовать для оформления ввода. В нашей форме на этой странице использованы следующие классы:

input:invalid, input:invalid:focus {
    color: red;
    box-shadow: none;
}

Эти классы позволяют выделить красным неверно введенные значения. Причем цвет поменяется в тот момент, когда пройдет валидация.

В результате такого оформления мы получили простой и универсальный способ сообщения об ошибочно заполненных полях, который не будет зависеть от браузера.

Форму вывода сообщений об ошибках можно приукрасить так, как это только придет вам в голову. Мы использовали самый простой и доступный вариант.

Поля со множественными значениями (checkbox и select multiple)

Возможно, вы сталкивались с тем, что вам может понадобиться поле для выбора нескольких значений одновременно (например, несколько опций услуги).

Делается это обычно с помощью полей checkbox и особой формы select multiple.

Для корректной работы формы с такими значениями нужно следовать общепринятому стандарту PHP и дать одинаковое значение для всех полей checkbox добавив в конце [].

Например, так:

<form>
    <input type="text" name="name" class="required" placeholder="Имя">
    <input type="text" name="phone" placeholder="Телефон">

    <input type="checkbox" name="tf[]" value="любой">
    <input type="checkbox" name="tf[]" value="стандарт">
    <input type="checkbox" name="tf[]" value="vip1-пятница">
    <input type="checkbox" name="tf[]" value="vip1-пятница без оборудования">
    <input type="checkbox" name="tf[]" value="vip2 суббота">
</form>

Для поля select multiple такая форма выглядит так (выбор осуществляется при нажатой клавише Ctrl):

<form>
    <select name="tour[]" class="uk-select required"  multiple>
                <option value="">пусто</option>
                <option value="Алмазный фонд<">Алмазный фонд</option>
                <option value="Оружейная палата">Оружейная палата </option>
                <option value="Территория Кремля">Территория Кремля </option>
                <option value="Большой Кремлевский Дворец">Большой Кремлевский Дворец</option>
                <option value="Грановитая палата">Грановитая палата</option>
    </select>
</form>

Такой подход очень изящно позволяет решить вопрос с многоязычными формами, а также такой нюанс, когда поле на сайте называется скажем "Ваше имя", а в письме должно приходить "Имя клиента". Еще один маленький нюанс, который очень сложно решить с помощью традиционных форм связи.

Сообщения "Подождите"

На время отправки письма и загрузки файлов плагин переводит кнопки отправки в состояние disabled во избежание повторного нажатия клиентом в процессе отправки. Так же значения кнопок меняются на указанные сообщения в параметрах плагина. Обратите внимание на то, что в это поле можно вносить HTML теги. Это очень удобно, если вы хотите вставить какой-либо спиннер на время ожидания отправки сообщения.

Например, для yootheme шаблонов или шаблонов на основе UIKit3 можно использовать такой код: <div uk-spinner></div> . Вы также можете вставлять какие-либо иконки или svg файлы.

Отправка фотографий и других разрешенных вложений

Чтобы создать поле для отправки разрешённых вложений, используйте стандартное поле с классом rf-upload-button.

<input class="rf-upload-button" name="fileupload" type="file">

Если нужно оформить красивые кнопки с кастомным дизайном, то в yootheme это будет выглядеть так:

<div class="uk-form-custom" uk-form-custom>
<button class="uk-button uk-button-primary rf-upload-button-text">ПРИЛОЖИТЬ ФОТО</button> 
<input class="rf-upload-button" name="fileupload" type="file">
</div>

Прошу обратить внимание на два тега с указанными css классами: rf-upload-button и rf-upload-button-text

Тег с классом rf-upload-button-text предназначен для отображения надписи. Именно он приобретает статус disabled на время загрузки файла и у него будет изменена надпись на "подождите" или любую из указанных в настройках плагина, пока идет загрузка файла на сервер. Тег с классом rf-upload-button-text должен быть на одном уровне вложенности с тегом с классом rf-upload-button. Обычно это укладывается в способы отображения кастомизированного поля для загрузки файлов для различных шаблонов Джумла.

Так как с помощью одной кнопки можно загрузить несколько файлов, то нужно предусмотреть место, куда будет выводиться список загруженных и готовых к отправке файлов. Заведите в удобном для вас месте тег div с классом rf-filenames-list . В этом диве будут появляться имена загруженных файлов или ошибки, которые возникают при загрузке.

<div class="rf-filenames-list"></div>

Обратите внимание — этот тег должен находиться внутри формы! Иначе он не будет очищен!

Типичный сценарий по загрузке файлов выглядит так — посетитель выбирает нужный файл и происходит его загрузка на сервер. Имя загруженного файла появляется в списке. Затем он выбирает следующий файл и опять происходит загрузка на сервер. Имя следующего файла опять появляется в списке. Если достигается ограничение на вложения — будет показана ошибка. Если попытаются подсунуть какой-либо тип файла, который не разрешен - будет отображена ошибка.

Настройка телеграм

На вкладке "Интеграция с другими сервисами" вы можете подключить отправку сообщений нужным вам людям с помощью телеграм бота.

Для этого включите тумблер "включить телеграм" и создайте телеграм бота с помощью бота @BotFather (можно просто перейти по этой ссылке).

Введём команду /newbot

Придумываем обычное и техническое имя с хвостиком bot. Самое важное — не забываем скопировать полученный ключ-токен.

Полученный от него HTTP API токен скопируйте в окошко HTTP API token и нажмите кнопку сохранить!

Если вы не сохраните токен — дальше ничего работать не будет!

Затем пошлите вашему боту любое сообщение.

После того как вы это сделаете — нажмите кнопку "обновить chat_id" и ваш chat_id появится в списке.

Если все сделали правильно — в списке появится chat_id вашего диалога с ботом.

Сохраните эти настройки! Не забудьте!

Если у вас будут использоваться разные адресаты для разных форм - выберите для каждого адресата свой Target ID.

Переопределение шаблона писем

Шаблон отправляемых писем тщательно тестировался на всех возможных клиентах и учитывает самые различные требования клиентов. Однако, следуя свободному духу Joomla, была добавлена возможность переопределения шаблона писем.

Для того чтобы это сделать вам нужно создать папку plg_system_radicalform в папке html вашего шаблона. Это стандартный способ переопределения представлений различных расширений Joomla.

Затем вам нужно будет скопировать файл default.php из папки /plugins/system/radicalform/tmpl в папку /templates/yootheme/html/plg_system_radicalform . Здесь yootheme надо поменять на имя папки вашего шаблона.

Этот файл вы можете модифицировать по своему усмотрению. Переменная $subject — это тема письма, $mainbody — основное тело письма, и $footer — дополнительная информация о посетителе. Вашему коду будут доступны все переменные формы в массиве $source.

Если вам нужна сильная кастомизация вывода переменных, используйте пример этого кода для формирования строки переменной:

$mainbody .= "<p>".JText::_($key) . ": <strong>" . $record . "</strong></p>";

Здесь $key – это ключ (имя вашего поля), а $record – это его значение. Этот код позволит произвести автоматическую замену языковых констант, которые вы переопределили в Joomla (чтобы вместо name выводилось "имя клиента").

Пример кода, который формирует $mainbody:

$mainbody="";
foreach ($source as $key => $record)
{
	if (is_array($record))
	{
			$record = implode(',', $record);
	}
	$mainbody .= "<p>".JText::_($key) . ": <strong>" . $record . "</strong></p>";
	$telegram.= JText::_($key) . ": <b>" . $record ."</b><br />";
}

Ссылка на соответствующий код в github, который формирует тело письмо, вот https://github.com/Delo-Design/radicalform/blob/f6f691dc8d4a6ecf616ff34287caebf19f7ad8fd/radicalform.php#L460

Интеграция с сервисом Jivosite

В принципе, для интеграции с сервисом особо ничего делать не надо – просто включить соответствующий переключатель на вкладке "интеграция с другими сервисами". Подразумевается, что к этому моменту код Jivosite уже установлен на сайте.

Следует обратить внимание на один момент – если вы хотите, чтобы информация о посетителе (такая, как email, его имя и телефон) попали в сервис Jivosite - нужно назвать поля формы соответствующим образом.

То есть поле с именем должно иметь имя — name:

<input class="uk-input required" name="name" placeholder="Ваше имя..." type="text">

Поле с телефоном должно иметь имя - phone:

<input class="uk-input required" name="phone" placeholder="Ваш телефон..." type="text">

Поле с email должно иметь имя email:

<input class="uk-input required" name="email" placeholder="Ваш email..." type="text">

Свой кастомный php код

Несмотря на то каким бы удобным и универсальным ни был плагин формы обратной связи, всегда может понадобиться интеграция со своим php кодом.

Может быть вам нужно будет добавить собственную интеграцию с каким-либо редким и экзотическим сервисом? Или нужно выполнить какие-то дополнительные действия при отправке формы?

Плагин предусматривает интеграцию с собственным php кодом.

Вам нужно создать свой php файл в папке /templates/yootheme/html/plg_system_radicalform . Здесь yootheme надо поменять на имя папки вашего шаблона.

Ваш файл должен начинаться со строк:

<?php
    defined('_JEXEC') or die;

Далее идет ваш код, который будет вызван в момент отправки вашей формы.

Вашему коду будут доступны все переменные формы в массиве $source. Например, если вы хотите обратиться к полю форму с именем name, то обращение к нему будет выглядеть так:

if(isset($source['name']))
{
	$contact_name=$source['name'];
}

Желательно проверять наличие ваших переменных в массиве, как указано в коде выше, так как формирование переменных происходит на сайте с помощью JavaScript файла.

В массиве будут находиться все переменные, в том числе дополнительные, которые содержат информацию о посетителе:
reffer - страница, с которой посетитель пришел на ваш сайт (может быть не установлена)
pagetitle - заголовок страницы с формой
resolution - разрешение экрана вашего посетителя
url - адрес страницы с формой
uniq - число, которое используется для формирования временного адреса хранения загруженных посетителем файлов. Адрес будет таким: '/tmp/rf-uniq'. После того как будет окончена работа плагина эти файлы будут удалены.

В своем скрипте не надо использовать переменные с именем $body!

Эта переменная используется для отправки email!

После того как файл будет создан, вам понадобится добавить его имя в интерфейсе плагина:

Если нужно, чтобы ваш код вызывался только на определенных формах, укажите targetID для вашего кода. В этом случае нужно будет создать скрытое поле с именем rfTarget:

<input name="rfTarget" value="3" type="hidden">

Если в форме не создано скрытое поле с именем rfTarget, то будут вызваны все кастомные файлы без заполненного поля targetID. И наоборот, если в форме создано скрытое поле с именем rfTarget — будут вызваны только файлы с указанным target.

Расширение функциональности за счет создания своих плагинов

Следуя хорошей практике всех расширений для Joomla, плагин RadicalForm дает возможность вам вмешаться в его работу и расширить недостающий функционал за счет создания своего плагина типа radicalform и перехвата события onBeforeSendRadicalForm.

Функция класса плагина, которая принимает вызов, выглядит примерно следующим образом:

public function onBeforeSendRadicalForm($clear, &$input, $params)
{
	$input['name']="test name";
}

Она получает следующие параметры:

$clear — это массив данных, полученный от формы и очищенный ото всех вспомогательных данных.

$input — это полный массив данных, включая все вспомогательные данные о пользователе и передаваемой форме. Этот массив передается по ссылке и у вас есть возможность изменить переданные данные. В примере выше именно это и происходит, когда вместо вбитого в форму имени устанавливается фиксированная константа.

$params — это объект, содержащий все параметры плагина и вспомогательные данные, которые известны при отправке формы. Например здесь можно получить адрес папки, куда были загружены фотографии (их можно переместить в нужное вам место):

$params->get('uploaddir');

Так же можно получить номер последней отправленной формы:

$params->get('rfLatestNumber');

Для того чтобы вам облегчить создание плагина была создана чистая болванка, которую можно использовать для своих целей. Скачать ее можно здесь:

Скачать тестовый плагин для RadicalForm

Интеграция с Bitrix24 CRM

Для интеграции с Bitrix24 CRM уже написан плагин Сергея Толкачева WT JoomShopping Bitrix24 PRO. Несмотря на то что в названии упоминается JoomShopping, плагин умеет работать и с RadicalForm. Скачать и прочесть подробнее можно по ссылке: https://web-tolk.ru/dev/joomla-plugins/wt-joomshopping-bitrix24-pro.html

Если вы хотите разработать свой вариант интеграции – можете использовать как отправную точку код интеграции, который расположен на gist от github.

https://gist.github.com/progreccor/fae1b97b4af4fc83a7ed552f9db4bd8b

Интеграция с AmoCRM

Для интеграции с AmoCRM лучше всего использовать плагин Сергея Толкачева WT AmoCRM - RadicalForm. Для работы плагина необходима библиотека WT AmoCRM. Плагин и библиотека работают только с Joomla 4 / Joomla 5. Скачать и прочесть подробнее можно по ссылке: Для интеграции с AmoCRM лучше всего использовать плагин Сергея Толкачева WT AmoCRM - JoomShopping плагин отправки заказов в Amo CRM. Несмотря на то что в названии указано про JoomShopping – плагин умеет работать и с RadicalForm. Скачать и прочесть подробнее можно по ссылке: https://web-tolk.ru/dev/joomla-plugins/wt-amocrm-radicalform

Если вы хотите использовать свой код для интеграции – можете использовать код интеграции, который расположен на gist от github.

https://gist.github.com/progreccor/59a8368da47b932df3c1a6b00a3ea093

Из-за особенностей настройки своих CRM не представляется возможным сделать универсальную интеграцию. Поэтому меняйте готовый файл под себя.

В этом поле можно указать сообщение, которое будет выводиться пользователям (или ботам), чье сообщение воспринято как спам.

Можно указать непосредственно сообщение или языковую константу, которую можно переопределить.

Можно указать блокируемые диапазоны задержки перед отправкой формы. Используется метрика "Через какое время после загрузки страницы отправлена форма".

Чтобы лучше понять смысл этой блокировки, нужно увидеть поведение некоторых ботов.

Как мы видим – бот здесь постит сообщение строго в указанное время после загрузки страницы. Можно указать время блокировки для таких сообщений. Причем можно указать несколько диапазонов через запятую.

Например:

Это значит, что если форма отправлена в течение 3 секунд после загрузки страницы, то она будет заблокирована как спам. А так же если форма будет отправлена спустя 12 секунд после загрузки – она тоже будет заблокирована как спам. Это позволит отсечь особо тупых и назойливых роботов.

Тут тоже все достаточно очевидно. Можно добавить нужное количество правил блокировки по содержимому полей. Можно использовать простое поле по наличию ключевого слова (например - виагра или wildberries) или же использовать более сложные правила на основе regexp для php.

Готовые примеры полезных правил блокировки с помощью регулярных выражений приведены ниже в отдельном поле.

Гепард и его детеныш (RadicalMart Business и RadicalMart Express)

Датой рождения RadicalMart считается 10 марта 2022 года. Именно тогда был создан первый репозитарий RadicalMart и добавлены в него первые строчки кода.

И, поскольку март считается кошачьим месяцем, символом RadicalMart должен был стать кто-то из кошачьего семейства.

Обычная домашняя кошка конечно очаровательна, но слишком ленива и медлительна, а вот гепард вполне соответствует основным чертам RadicalMart и воплощает все его положительные стороны.

И если вы думаете что гепард – это про Африку и саванну, то это не так. Эти животные упоминаются даже в «Слове о полку Игореве»: «На реке на Каяле тьма свет покрыла — по Русской земле простерлись половцы, точно выводок гепардов».

В те времена на Руси гепарды использовались для охоты, как сейчас охотничьи собаки.

При внимательном изучении этого замечательного животного, в его повадках и образе жизни можно найти значительно больше общего с RadicalMart и сообществом вокруг него, чем кажется на первый взгляд.

Гепард – это самое быстрое млекопитающее на планете. Его скорость может достигать 112 км/ч. Подобно ему RadicalMart выделяется своей скоростью среди всех интернет магазинов.

В отличие от существующих решений электронной коммерции, построенных на базе устаревшей технологии EAV, RadicalMart использует все преимущества новых версий баз данных Mysql 8 и MariaDB 10 и 11.

Это позволяет интернет-магазинам, созданным на основе RadicalMart, работать с огромным числом товарных позиций (порядка нескольких миллионов и больше) с невероятной скоростью.

Так же как гепард легко настигает свою добычу, RadicalMart превосходит все другие реализации интернет-магазинов по своей скорости и гибкости.

Продуманная архитектура, изящество решений, поддержка всех современных технологий позволяют решениям на основе RadicalMart оставаться быстрее и сильнее всех остальных интернет-магазинов.

Гепарды являются самыми быстрыми наземными животными в мире

Гепарды при охоте очень сосредоточены и целенаправленны,

Гепарды – это чрезвычайно ловкие и маневренные охотники. Они обладают исключительно гибким телом, длинными ногами и мощными мышцами, что является ключевым фактором, делающим их такими выдающимися охотниками.

Эта гибкость играет важную роль в их способности быстро менять направление движения во время погони и быть удачливыми охотниками.

Невероятная гибкость гепарда во время охоты

Подобно гепарду RadicalMart очень гибкий и хорошо настраиваемый интернет-магазин. В погоне за своими клиентами вы можете изменить его поведение так, как нужно вам и тогда точно ваша охота будет успешной!

С RadicalMart вы никогда не услышите – «это нельзя сделать». Подобно гепараду, даже на полной скорости, RadicalMart позволит извернуться и достичь нужной цели.

Все цели достижимы, если вы используете RadicalMart!

Гепарды хорошо приспособлены к различным условиям и встречаются в разных местах нашей планеты – от пустынь до саванн. Они встречаются и на южных границах нашей страны. Это говорит об их способности выживать в разнообразных условиях.

Прекрасная адаптация к сложным условиям

Так же как и гепард, RadicalMart прекрасно работает в самых различных окружениях. Ему не требуется каких-то особых серверов и ресурсов. Довольствуясь малым RadicalMart обеспечивает его владельцу стабильную и надежную работу магазина.

У гепарда мягкий и миролюбивый нрав . Когда гепард доволен, он начинает урчать как огромный домашний кот. Гепард очень быстро привыкает к человеку и его очень легко приручить (прямо как RadicalMart).

На фото – гепард Герда из Пензы

RadicalMart привычен и понятен как разработчикам, так и менеджерам, которые с ним работают. Для разработчиков очень удобно, что RadicalMart строго придерживается канонов разработки Joomla и следует современным тенденциям. А для менеджеров очень удобно, что интерфейс не перегружен специфическими деталями, которые нужны только разработчикам.

Идеальный баланс и дружелюбие к пользователям – это то, что дает RadicalMart каждому, кто впервые с ним сталкивается в своей работе.

• Дизайн и внешний вид
• Администрирование
• Бухгалтерия и склады
• Оплата и доставка
• Поисковое продвижение
• Разработчикам
• Аддоны для платформы

Все редакции RadicalMart

Перейти в раздел

Скачать в SVG формате

Оставьте заявку на участие
в партнёрской программе