Самое прекрасное — это когда нужна поддержка сайта, а ты сидишь с телефоном
в руке и ЗНАЕШЬ, чей номер набрать! т. +7 831 4637611 моб. +7 910 3820622Айтишник РУ Нижний Новгород, Симферопольская, 21
A+ A A-

aiContactSafe - формы обратной связи

Одной из распространенных задач для веб-мастера, является создание почтовых форм или форм обратной связи для оправки писем (сообщений) с сайта. В Joomla это можно реализовать несколькими способами, в том числе и стандартно, с помощью компонента «Контакты». Но в этой статье я расскажу о том, как можно создать формы для отправки сообщений, формы обратной связи и о том, как их вставить в любое место сайта с помощью стороннего компонента. Этот компонент называется aiContactSafe. Он абсолютно бесплатен, но вы можете помочь развитию такого полезного проекта, пожертвовав небольшую сумму. Скачать его можно через JED или с сайта разработчика, предварительно зарегистрировавшись. Или можно скачать с сайта Aitishnik.Ru. На момент написания статьи актуальной была стабильная версия aiContactSafe 2.0.21с, совместимая как с Joomla 1.5, так и с Joomla 2.5.

В состав компонента форм обратной связи aiContactSafe входят:

  1. Модуль Mod_aiContactSafe, который выводит форму обратной связи в любой позиции шаблона сайта.
  2. Плагин Plg_aiContactSafeForm, который нужен для размещения формы обратной связи прямо в статье.
  3. Плагин Plg_aiContactSafeLink, нужный для размещения ссылки на форму обратной связи в статье.

Компонент aiContactSafe обладает следующими возможностями:

  • Имеет свой встроенный защитный код (CAPTCHA). Встроенная CAPTCHA может задавать кодовые слова для различных языков, выводить вместо слов случайный набор символов заданной длины. Защитный код легко интегрируется в дизайн сайта благодаря настройкам цвета символов и цвета фона.
  • Поддержка профилей. С помощью профилей, на сайте можно создать различные виды форм, с различным набором пользовательских полей. Например, в одном профиле можно настроить форму обратной связи для отправки резюме, а в другом профиле форму заявки на подбор персонала, а в третьем профиле настроить форму для отправки сообщения администратору сайта и т. д.
  • Неограниченное количество пользовательских полей различного типа: текстовое поле, флажок, переключатель, список, выпадающий список, разделитель, вложение файла, контакт Joomla, адрес электронной почты, скрытое поле, многострочное текстовое поле.
  • Добавление префиксов (заголовков) и суффиксов полей.
  • Перенаправление на указанную страницу в случае успешной отправки сообщения (письма).
  • Добавление любого количества вложений, работающих как с AJAX, так и без него.
  • Поддержка SEF. Можно использовать как родной SEF Joomla, так и ARTIO JoomSEF или sh404SEF.
  • Поддержка многоязычности.
  • Языковые файлы для более чем двадцати языков.
  • Указание дополнительной (контактной) информации с помощью редактора WYSIWYG.
  • Подробные инструкции по настройке и администрированию (на английском).
  • Блокировка пользователя по IP адресу.
  • Блокировка сообщений по определенным словам (стоп-словам).
  • Автоматическая блокировка IP адресов, которая срабатывает через заданное время, если посетитель сайта с определенного IP адреса отправляет сообщения содержащие стоп-слова.

Итак, скачиваем компонент и производим стандартную установку, используя «Менеджер расширений». После успешной установки переходим в меню «Компоненты» и выбираем пункт «Форма обратной связи». По умолчанию компонент будет открыт на вкладке «Сообщения». Сообщений у нас пока нет, поэтому займёмся настройкой. Перейдем на вкладку «Статусы сообщения» и переименуем их. У компонента есть небольшие проблемы с локализацией, поэтому для удобства приходится их исправлять вручную.

aiContactSafe Статусы сообщения

Кликаем по названию статуса и переименовываем: New в Новое, Read в Прочитанное, Replied в Отправленное, Archived в Архивное.
Переходим на вкладку «Панель управления». Здесь находятся общие настройки компонента. Большую часть настроек можно оставить со значениями по умолчанию. Стоит обратить внимание на блок антиспам-настроек.

aiContactSafe  настройки антиспама

Сейчас мы не будем настраивать этот блок – каждый настраивает его сам, согласно своим потребностям. Рассмотрим в вкратце эти настройки.
Активировать контроль SPAM'а. Включает/выключает контроль спама по стоп-словам. Если в сообщении будут найдены стоп-слова, то оно не будет отправлено. Работает в паре со следующей опцией.
Блокировать письма содержащие. В это поле вписываются стоп-слова, через «;».
Записывать заблокированные сообщения. Включает запись сообщения, помеченного как СПАМ в БД. Оставляем включенным – для контроля.
Активировать запрет по IP адресу. Если активировать эту опцию, то посетители с отмеченных, ниже IP адресов не смогут получить доступ к форме обратной связи (контактной форме).
IP адреса для блокирования. Это поле содержит список блокируемых ip адресов. Посетители, пришедшие на сайт с одного из указанных адресов, не смогут получить доступ к контактной форме. Для блокировки больших сегментов сети можно использовать символы подстановки, например «*». Если записать так: 123.*.*.*, то будут запрещены все IP адреса, начинающиеся с 123.
Перенаправлять заблокированные IP адреса на. В это поле можно ввести адрес страницы, на которую будет перенаправлен посетитель сайта, если он пришёл с заблокированного IP адреса. Если ничего не указать, то перенаправление будет выполнено на главную страницу сайта.
Запрещать IP-адреса, которые отправляют сообщения с заблокированными словами. Включает/выключает автоматическую блокировку IP адресов посетители, с которых отправляют сообщения со стоп-словами. Блокировка будет срабатывать, если будут выполнены условия двух, нижеследующих опций.
Максимальное количество заблокированных сообщений перед запретом IP. Предельное количество сообщений со стоп-словами, после которого IP адрес будет заблокирован.
Минуты для подсчёта заблокированных сообщений. Период времени, в который осуществляется подсчёт сообщений со стоп-словами.
Отправлять email с сообщением о запрете IP. Адрес электронной почты, на который отправляется сообщение о срабатывании автоматической блокировки IP адреса.
Кроме блока антиспам-настроек следует обратить внимание на настройки, которые находятся в нижней части окна.

aiContactSafe панель управления

Следующие четыре опции относятся к настройке вложений, отправляемых с письмом.
Максимальный размер вложения (в байтах). Если в форме обратной связи будет поле для вложения файла, то полезно ограничить его максимальный размер. По умолчанию 5 Мб.
Разрешённые типы вложений. В этом поле через запятую можно указать разрешенные типы вложений.
Присоединить к сообщению. Определяет отправку вложения. Можно присоединить вложение к сообщению, а можно с сообщением отправить ссылку на файл, который при отправке будет сохранён на сервере.
Удалить файлы после отправки сообщения. Если вложение отправляется прикреплённым к сообщению, то файл вложения можно удалять с сервера. Например, для экономии дискового пространства.
Проверить языковые файлы. Нажатие этой кнопки запускает процедуру проверки языковых файлов для соответствующего языка.
Следующие три опции доступны, если установлены соответствующие им компоненты: ARTIO JoomSEF, Joom!Fish и FaLang. Если на сайте установлены данные компоненты, то имеет смысл включить их интеграцию с aiContactSafe.
За этими настройками следуют три кнопки включения вышеописанных составляющих компонента. По умолчанию они выключены. Кнопки сопровождает устрашающее предупреждение. Нам с вами нужно знать, как это работает, поэтому включаем все три.
Далее следует настройка прав доступа к компоненту. Здесь можно установить группу пользователей сайта, которая может читать сообщения с лицевой части сайта. По умолчанию «Супер-пользователи». Так и оставим.
Название кнопки «Удалить таблицы из базы данных» говорит само за себя. Она может понадобиться в исключительных случаях, когда нужно полностью удалить или полностью переустановить компонент. Нажатие на эту кнопку удалит в базе данных сайта все таблицы, созданные компонентом aiContactSafe. Без резервной копии их восстановить не удастся!
Следующую часть настроек рассмотрим на простом практическом примере. Допустим, что на сайте кадрового агентства нужно разместить две формы обратной связи: первая – общая, для контактов по общим вопросам, а вторая – для отправки резюме. Для первой формы будет создана страница и пункт меню «Контакты», а вторая форма будет размещаться на страницах с вакансиями. В первой форме обратной связи нам нужна следующая информация: имя отправителя, адрес электронной почты, тема сообщения, текст сообщения и возможность отправки копии сообщения отправителю. Во второй контактной форме нам понадобятся следующие поля: имя отправителя, адрес электронной почты, название вакансии и возможность прикрепления файла с резюме.
В компоненте aiContactSafe переходим на вкладку «Поля».

aiContactSafe поля

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

aiContactSafe редактирование поля

Название. Это внутренняя переменная компонента. Всегда пишется латинскими буквами без пробелов. Оставляем как есть.

Field label (метка поля). Это заголовок в поля в форме обратной связи. Меняем на Отправитель.

Label parameters (параметры метки). Здесь можно задать дополнительные стили, как если бы мы задали стили в тегах <style>. Только кавычки должны быть одинарными. Например, мы хотим, чтобы при наведении указателя мыши всплывала подсказка. Тогда в этом поле можно написать: title='Ваше имя, например Сергеев Николай Николаевич'.

Field label in message (метка поля в письме). Это заголовок в письме получателя. Мы ведь получим письмо! Меняем на Отправитель.

Label in message parameters (параметры метки поля в письме). То же, что и Label parameters, только для письма.

Метка после поля. Если надо, чтобы заголовок был не перед полем ввода, а после.

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

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

Field values (значения поля). Так же недоступен для текстовых полей. Нужен для полей списков, выпадающих списков, групп флажков и переключателей.

Лимит поля. Параметр, ограничивающий количество символов в текстовом поле. Больше символов, чем указано в этом параметре ввести нельзя. Ограничим это поле 60 (шестьюдесятью) символами.

Field parameters (параметры поля). Такая же настройка, что и для метки поля. Но относящееся уже к самому полю ввода. По умолчанию уже содержит значение. Добавим к нему свои пять копеек, чтобы получилось class='textbox' title='Ваше имя, например Сергеев Николай Николаевич'. Пусть тоже будет всплывающая подсказка.

Автозаполнение. В нашем случае Нет.

Значение по умолчанию. Можно сразу задать значение поля по умолчанию, но нам это не надо.

Префикс поля. Информация, которая будет добавлена прямо перед полем ввода.

Суффикс поля. Информация, которая будет добавлена прямо после поля ввода.

Field required (необходимое поле). Поле, обязательное для заполнения.

Включать в тело письма. Отображать ли значение поля в письме получателя.

Опубликовано. Включено поле или выключено.

Сохраняем настройки. Теперь вы можете самостоятельно поправить текстовые поля «Phone» и «Subject». Присвойте метки Телефон и Тема соответственно.

Поле «Email», практически ничем не отличается от текстового поля. Различие состоит в том, что для этого типа полей предусмотрена проверка на ввод корректного адреса электронной почты. Поправим только метки поля – пусть будут Эл. почта.

Для поля «Message» зададим значение для меток Сообщение. Можем установить лимит в 1000 символов (на своё усмотрение). Тип этого поля – «Расширенное текстовое поле», а значит и настройки идентичны.

В настройках поля «Send a copy of this message to yourself» так же поменяем метки на Отправить копию сообщения себе. Это поле представляет собой флажок (галочку). Если опция установлена, отправитель получит копию своего сообщения на адрес электронной почты, который он указал выше.

Всё, существующие поля поправили! Теперь создадим два нужных нам поля: текстовое поле «Вакансия» и поле для прикрепления файла резюме к сообщению. Для этого всё в той же вкладке «Поле» кликаем на кнопке «Добавить». В открывшемся окне задаём значение поля Название: aics_vacancy. По умолчанию тип создаваемого поля «Текстовая строка» - это то, что нам нужно для создания поля «Вакансия». С текстовыми полями вы уже умеете работать, так что настроите сами. На всякий случай ниже привожу скрин своих настроек.

aiContactSafe создание нового поля

Теперь создадим поле для прикрепления файла к сообщению. Нет ничего проще! Нажимаем кнопку «Добавить», название поля - aics_file, метка поля - Прикрепить файл с резюме до 5 Мб(zip,rar,doc), метка поля в письме - Прикрепить файл, тип поля – Файл.
Теперь, когда есть все необходимые поля можно настроить профили. В компоненте aiContactSafe переходим на вкладку «Профайлы». Профайлы или профили – это наборы настроек для определённой формы обратной связи. Мы видим, что здесь о нас тоже позаботились и сделали два профиля. Кликаем на названии первого профиля (его ID - 1) и открываем его для редактирования. Настроек довольно много, но все они интуитивно понятны. Делаем следующее:

  • Меняем название профиля, чтобы было понятнее
  • Включаем опцию «Использовать AJAX для отправки формы»
  • Если нужно, то настраиваем отображение CAPTCHA

aiContactSafe настройка профиля

Здесь стоит обратить внимание вот на что. Если мы меняем максимальную длину слова для CAPTCHA, то нужно не забывать о «Ширине CAPTCHA». Чтобы не получилось так, что при заданной ширине отображаются не все символы. Другими словами, чтобы они поместились.

  • Если хотим, чтобы сообщения приходили на адрес электронной почты отличный от указанного в общих настройках сайта, то заполняем поле Электронный адрес. Следует помнить, что в это поле вводится адрес электронной почты, который будет работать с вышеуказанными настройками. Т. е. если в это поле ввести адрес ящика из другого домена, например из yandex.ru, то нужно будет соответствующим образом редактировать параметры отправки почты в общих настройках сайта.
  • Заполняем префикс темы письма.
  • Если нужно, меняем формат письма с HTML на «Простой текст».
  • Изменяем значение поля Обозначить необходимые поля символом (ами).
  • Изменяем Уведомление об обязательных полях.
  • Пишем своё Сообщение благодарности.

aiContactSafe настройки профиля

  • Сортируем и отмечаем нужные для этого профиля поля.

aiContactSafe настройка профиля

Кликаем на кнопке «Применить» и поднимаемся в верхнюю часть окна. Здесь нас интересуют кнопки: Edit Contact, Edit CSS, и Edit Email. Этими кнопками можно воспользоваться не только в этом окне. Они присутствуют в панели управления вкладки «Профайлы». Требуется только выделить нужный профиль и нажать соответствующую кнопку.


Итак, нажимаем кнопку Edit Contact. В открывшемся окне мы можем отредактировать контактную информацию формы обратной связи или вообще убрать её. Информация корректируется редактором по умолчанию, установленным для текущего пользователя. Заполняем так, как нам нужно.

aiContactSafe редактирование контакной информации

Сохраняем изменения. Теперь если нужно, то изменяем оформление (стили). Для этого выделяем профиль «Common» и нажимаем кнопку «Edit CSS». Подробно настройки CSS описывать не буду - во-первых, у каждого они свои, а во-вторых, это выходит за рамки статьи. Коснусь лишь вскользь. Каждый файл CSS для профиля уже содержит примеры того, как можно изменить стиль элемента формы обратной связи. Для существующих полей записи уже сделаны. Для новых элементов, если требуется, нужно скопировать строку для соответствующего типа, изменить идентификатор «field_name» на имя нового поля и добавить свойства.

aiContactSafe редактирование CSS

После настроек CSS можно настроить вид приходящего письма. Для этого надо выделить профиль и нажать кнопку Edit Email. Редактирование вида приходящего сообщения – это задача не для новичков. На первых порах, оставляйте как есть - главное, что в нём содержится требуемая информация.
Один профиль настроили. Теперь мы можем поместить контактную информацию и форму обратной связи на сайте. Для этого в нужном меню добавляем пункт «Контакты», а тип пункта меню назначаем «Contact Form».

aiContactSafe Назначение пункта меню

Заголовок меню задаём, например Контакты. В обязательных параметрах уже выбран профиль «Common» т. к. он является профилем по умолчанию.

aiContactSafe Выбор профиля

 

Сохраняем изменения и переходим на фронтальную часть сайта. Кликаем по пункту меню «Контакты» и видим, что у нас получилось.

aiContactSafe Страница "Контакты"

Заполняем поля и отправляем сообщение. Если всё настроено правильно, то электронное письмо появится во вкладке «Сообщения».
Теперь настроим второй профиль (Module form) и рассмотрим работу модуля и плагинов aiContactSafe. А именно, как вставить модуль с формой обратной связи, как вставить форму обратной связи в статью и как сделать ссылку на такую форму.
Основные настройки второго профиля:

  • Название профайла: resume
  • Поле для использования в качестве темы: aics_vacancy Вакансия
  • Поле для использования в качестве послать отправителю: нет

aiContactSafe настройка профиля

  • Выбираем нужные нам поля и сортируем их

aiContactSafe настройка профиля

Если требуется, меняем «Префикс темы электронного письма» и переводим уведомления. Остальные настройки редактируем по своему усмотрению. Сохраняем. Удаляем всю контактную информацию для этого профиля.

aiContactSafe профайлы

Как вывести формы обратной связи модулем

В настройках панели управления aiContactSafe мы включили модуль Mod_aiContactSafe. Теперь с помощью этого модуля вставим форму для отправки резюме в произвольную позицию шаблона. Для этого переходим в «Менеджер модулей», находим там модуль «aiContactSafe module», открываем его и соответствующим образом редактируем.

aiContactSafe модуль обратной связи

Главное, на что нужно обратить внимание при редактировании модуля – это правильно выбранный профиль. В поле «Profile's CSS» можно выбрать использовать ли CSS компонента или шаблона сайта. А в поле «Fields values» для полей формы обратной связи можно ввести предустановленные значения, например "aics_vacancy=бухгалтер".

aiContactSafe параметры модуля

Если в «Менеджере модулей» не окажется модуля «aiContactSafe module» или потребуется ещё один, то просто создайте его.

Как вставить форму обратной связи в статью

Для того чтобы вставить форму обратной связи с помощью aiContactSafe в статью нужно, чтобы в настройках панели управления компонента был включен плагин Plg_aiContactSafeForm. Это мы уже сделали. Теперь в нужное место страницы добавляем следующий код (без пробелов): { aicontactsafeform pf=2|use_css=2 }.
pf=2 – это id используемого профиля.
use_css=2 – это css используемого профиля.
Так же, как и в модуле можно включить предустановленные значения для полей. Это может выглядеть так:

aiContactSafe Вставка формы в статью

Смотрим, что получилось.

aiContactSafe Форма обратной связи в статье

Как вставить ссылку на форму обратной связи

Для того чтобы вставить ссылку на форму обратной связи с помощью aiContactSafe нужно, чтобы в настройках панели управления компонента был включен плагин Plg_aiContactSafeLink. Ниже приведен пример такого кода.

aiContactSafe Вставка ссылки

 В параметре «text» пишем анкор ссылки. Параметр «pf» нам уже знаком – это id профиля. И через имя поля «aics_vacancy» указываем предустановленное для этого поля значение «Системный администратор». В конечном итоге получаем следующее.

 aiContactSafe Вставка ссылки в статью

Этим заканчиваю статью. Теперь, когда вы вооружены знаниями, вы можете конструировать какие угодно формы обратной связи и размещать их в любом месте своего сайта. Не забывайте, что у компонента есть встроенная справочная система – пользуйтесь ей!  Ну и конечно же захаживайте на сайт Aitishnik.Ru.

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

Об авторе:

ZolkinМеня зовут Андрей Золкин. Из более, чем пятнадцати лет работы в сфере информационных технологий, десять лет работаю с системами, базирующимися на открытом исходном коде. На страницах сайта Aitishnik.Ru веду блоги по CMC Joomla и Debian GNU/Linux.

 

Ещё статьи о Joomla 2.5

    • Настройка Apache, MySQL, PHP

      Настройка Apache, MySQL, PHPОткрываем в текстовом редакторе конфигурационный файл вэб-сервера Apache. Он называется httpd.conf и находится в корневой папке сервера, в поддиректории conf. В нашем примере C:\www\conf\httpd.conf. Найдём и раскомментируем (удалим...

    • Virtuemart - изменение цены в зависимости от свойства товара...

      Virtuemart - изменение цены в зависимости от свойства товара...Многие владельцы интернет магазинов на Virtuemart 1.1.x сталкивались со следующей задачей: есть варианты одного и того же товара, которые отличаются друг от друга только каким-нибудь свойством, например, размером, фасовкой, массой,...

    • Восстановление сайта на Joomla 2.5

      Восстановление сайта на Joomla 2.5В этой статье мы рассмотрим восстановление сайта под управлением Joomla 2.5 из резервной копии созданной, компонентом Akeeba Backup. Для восстановления сайта нам потребуются: последняя резервная копия и скрипт Akeeba Kickstart с сайта Akeeba Backup. Нам не...

    • Joomla 2.5

      Joomla 2.5Здравствуйте, дорогие читатели и читательницы! Это первая статья посвящённая созданию сайтов на Joomla. И в ней я хочу рассказать о CMS Joomla!, о том для чего она нужна, о преимуществах Joomla 2.5 и об её отличиях от предыдущих версий. За читателем остаётся право согласиться с автором...

    • Шаблоны на Joomla, коренные отличия от аналогов...

      Шаблоны на Joomla, коренные отличия от аналогов...Макеты на основе этой системы предоставляются в достаточно широком ассортименте. Тех, кто желает иметь собственный интернет-ресурс, привлекает огромный выбор расширений, легкость управления. Шаблоны сайтов используют как разработчики...

    • Материалы в Joomla 2.5. Материалы (Статьи)...

      Материалы в Joomla 2.5. Материалы (Статьи)...В этой статье мы продолжим разговор о материалах в Joomla 2.5. В предыдущих статьях о материалах в Joomla мы говорили об общих сведениях и о категориях. В этой статье поговорим о собственно материалах. В предыдущих версиях Joomla эта сущность называлась статьи. На мой взгляд, это было...