Форма обратной связи на jQuery и PHP. Отдел контроля качества

Информация, представленная на этой странице ориентирована в первую очередь для начинающих web-мастеров.

Здравствуйте, друзья, уважаемые посетители моего скромного сайта! Наверняка, многим из Вас, в том числе и начинающим web-мастерам, известно, что такое и для чего нужна ФОС (форма обратной связи).

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

Понятно, что при использовании CMS, например бесплатных Joomla и WordPress, вопрос обратной связи можно решить использованием различных расширений или плагинов, но есть альтернативные способы, которые могут быть полезны для любого проекта, построенного как на чистом HTML, PHP, так и использующего движок.

В Сети можно найти довольно много скриптов различных ФОС - и простых и очень навороченных, которые устанавливаются на сайт как полноценная CMS и требуют для своей работы не только поддержку PHP, но и базы данных. Вам придётся, скорее всего, искать, находить и опробовать много вариантов, которые подходят именно Вам.

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

Ещё стоит сказать, что есть неплохие сервисы создания форм обратной связи, но сейчас речь пойдёт об одной интересной и нетрадиционной ФОС. Главное её отличие от других образцов в том, что она не нуждается в наличии и использовании почтового клиента. Это web-форма и сообщения в ней создаются, отсылаются на web-странице и получаются на web-странице. Иными словами, данная форма работает в пределах сервера вашего сайта, не используя сервер какой-либо электронной почты .

На бесплатном хостинге с PHP недоступен SMTP-сервер, поэтому создать сервис отправки сообщений со страницы сайта по электронной почте на E-mail администратора, не представляется возможным. Предлагаемый комплект ФОС решает эту проблему и предоставляет как отправителям сообщений со страницы сайта, так и его администратору, удобный способ обмена сообщениями.

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

Капля полезной информации

В дальнейшем, чтобы не испытывать сложности в перекодировке файлов, прочтите небольшой «ликбез». Для выполнения перекодировки, например, с windows-1251 на utf-8 необходимо:

  1. Открыть все файлы в текстовом редакторе, лучше всего в Notepad++;
  2. Удалить записи о старой кодировке, например,
    ;
  3. Перекодировать поочерёдно все файлы (Кодировки → преобразовать в utf-8 без BOM);
  4. Вставить записи о новой кодировке, например,
    ;
  5. Сохранить изменения во всех файлах (файл → сохранить все).

В этих действиях важно соблюдать очерёдность выполнения операций, иначе вместо русских слов получите непонятные «кракозябры».

1. Скачайте нужный архив с материалом и распакуйте в текущую папку на компьютере. В папке feedback Вы увидите папку img с изображениями и файлы формы . Папку feedback закачайте целиком на сервер своего сайта.

ВНИМАНИЕ! Если файлы загружены на сервер, то необходимо для файла message.txt установить атрибуты: 666 , иначе чтение и запись в файл будут не возможны и сервер выдаст сообщение об ошибке.

2. В адресную строку своего браузера введите адрес:
//ваш домен/feedback/feedback.php
Загрузится страница обратной связи с формой для ввода данных. Можно проверить работу формы, заполнив все поля и отправить сообщение. Сделайте в нужном месте ссылку на эту страницу со своего сайта.

3. Для проверки сообщений следует ввести в адресной строке браузера адрес:
//ваш домен/feedback/message.php
Загрузится страница с заголовком сообщения, с данными и текстом отправленного сообщения. Для удаления всех записей нужно нажать на странице кнопку Удалить все . Сделайте закладку страницы с сообщениями (message.php), чтобы можно было легко открыть её в следующий раз.

ФОС готова к работе на вашем сайте. Сколько времени ушло у Вас на её установку?

Вариант №2. Установка ФОС в шаблон сайта.

Данную форму можно также вставить в шаблон сайта на PHP. Эта задача чуть-чуть сложнее.

Форма будет выглядеть примерно ТАК , а сообщения можно принимать .


Файлы в кодировке utf-8, если ваш сайт в иной кодировке - их нужно перекодировать. Это Вы уже сможете сделать сами.

Страницы feedback.php и send.php имеют для наглядности предварительное оформление, которое в дальнейшем не потребуется ввиду того, что отмеченные необходимые блоки (начало блока → конец блока) в файлах feedback.php и send.php нужно будет скопировать и вставить в шаблоны страниц вашего сайта. Затем эти шаблоны следует переименовать соответственно в feedback.php и send.php . В Главном меню вашего сайта должна присутствовать ссылка на страницу обратной связи feedback.php .

Не потребуются и файлы header.php, footer.php , который служат для формирования страниц feedback.php и send.php при предварительном тестировании.

Файлы message.php и deltext.php являются служебными страницами для администратора сайта. Их можно оставить без изменений, либо оформить по своему вкусу.

Все эти файлы должны находиться в корневом каталоге вместе с файлом message.txt :

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

Если на хостинге с PHP используется сайт, содержащий обычные HTML-страницы, то в шаблон страницы для обратной связи с именем feedback.html следует вставить форму из файла feedback.php . А в шаблон HTML-страницы с именем send.html вставить блок скрипта из соответствующего файла и переименовать страницу в send.php .

Это всё! Используйте ФОС по максимуму, общайтесь с посетителями, развивайте свой ресурс и всех Вам благ! Не забывайте посещать мой сайт. Ваш Л.М.

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

После скачивания извлекайте архив на Ваш сайт (смотрите, ничего не сотрите у себя). Теперь давайте его настроим. Для этого открываем файл "config.php ". И меняем значения следующих переменных:

  1. "mailto " - поставьте вместо "[email protected] " адрес своего почтового ящика.
  2. "charset " - поставьте кодировку, хотя если Ваш сайт русскоязычный, то можете оставить "windows-1251 ".
  3. "content " - советую оставить "text/plain ", так как вряд ли Ваши посетители будут отправлять Вам сообщения в HTML-формате .

Теперь Вы можете запустить файл index.php у скрипта. В результате, перед Вами возникнет форма. Можете её заполнить и отправить письмо.

Теперь встаёт вопрос: "Как вставить эту форму обратной связи на свой сайт? ". Чтобы это сделать, найдите файл, который отвечает у Вас за страницу обратной связи (пусть это будет "feedback.html "). Сразу измените расширение на php (то есть на "feedback.php "). Скопируйте код из index.php скрипта в файл со страницей обратной связи (feedback.php ). Теперь Вы можете делать всё, что пожелаете нужным между тегами и , только не стирайте то, что Вы вставили из index.php . То что между тегов и ?> тоже не трогайте, если точно не знаете, что делаете.

И, наконец, если Вам не нравится внешний вид формы, то Вы можете его подкорректировать в файле "styling.css ".

Если у Вас остались какие-либо вопросы, либо происходят какие-то глюки со скриптом (я его не тестировал), то пишите мне на e-mail , чтобы я исправил.

Чтобы не зависеть от работы чужих скриптов, научитесь их создавать самостоятельно. Этому Вас научит мой Видеокурс "PHP и MySQL с Нуля до Гуру ":

На этом уроке мы познакомимся с функцией mail () , на примере создания формы обратной связи на PHP с последующей отправкой полученных данных на почту.

Для этого создадим два файла - forma.php и mail.php . В первом файлике будет находиться только форма с полями для ввода пользователем данных. Внутри тега form - кнопка "Отправить" и атрибут action , который ссылается на обработчик - mail.php , именно к нему обращаются данные из формы при нажатии кнопки "Отправить" . В нашем примере данные формы отправляются на веб-страницу с названием «/mail.php» . На этой странице прописан скрипт на PHP , который обрабатывает данные формы:


Данные формы отправляются методом POST (обрабатывается как $ _POST ). $ _POST - это массив переменных, переданных текущему скрипту через метод POST .

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




Форма обратной связи на PHP с отправкой на почту


Форма обратной связи на PHP







Оставьте сообщение:
Ваше имя:



E-mail:

Номер телефона:

Сообщение:

Текстовая область может содержать неограниченное количество символов-->







Так форма визуально выглядет в браузере.

Далее пишем код для файла mail.php . Придумываем сами имена для переменных. В PHP переменная начинается со знака $ , а затем имя переменной. Текстовое значение переменной заключается в кавычки. С помощью переменных на емайл администратора передается содержимое формы, просто подставив в квадратные скобки имя элемента формы - значение name .

$to = "[email protected]"; // емайл получателя данных из формы
$tema = "Форма обратной связи на PHP"; // тема полученного емайла
$message = "Ваше имя: ".$_POST["name"]."
";//присвоить переменной значение, полученное из формы name=name
$message .= "E-mail: ".$_POST["email"]."
"; //полученное из формы name=email
$message .= "Номер телефона: ".$_POST["phone"]."
"; //полученное из формы name=phone
$message .= "Сообщение: ".$_POST["message"]."
"; //полученное из формы name=message
$headers = "MIME-Version: 1.0" . "\r\n"; // заголовок соответствует формату плюс символ перевода строки
$headers .= "Content-type: text/html; charset=utf-8" . "\r\n"; // указывает на тип посылаемого контента
mail($to, $tema, $message, $headers); //отправляет получателю на емайл значения переменных
?>

Таким образом данные из массива $_POST будут переданы соответствующим переменным и отправлены на почту при помощи функции mail . Давайте заполним нашу форму и нажмем кнопку отправить. Не забудьте указать ваш е-майл. Письмо пришло моментально.

В соответствии с Федеральным законом от 27 июля 2006 г. № 152-ФЗ «О персональных данных» я, субъект персональных данных, именуемый в дальнейшем Пользователь, отправляя информацию через формы обратной связи (далее – Формы) на интернет-сайте (далее – Сайт), а также на адреса корпоративной электронный почты Адвокатского бюро «Деловой фарватер», заканчивающиеся на (далее – Корпоративная почта), свободно, в своей воле и в своем интересе, выражаю Адвокатскому бюро «Деловой фарватер» (ОГРН 1167700058679; ИННН 9705068808), располагающемуся по адресу: 109240, г. Москва, улица Гончарная, дом 24, (далее – Оператор), согласие на обработку моих персональных данных (далее – Согласие) на следующих условиях.

1. Моментом принятия Согласия является маркировка соответствующего поля в Форме и нажатие на кнопку отправки Формы на любой странице Сайта, а также нажатие на кнопку отправки электронного письма, содержащего персональные данные Пользователя, на адрес Корпоративной почты Оператора.

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

3. Обработка персональных данных осуществляется как с использованием средств автоматизации, в том числе в информационно-телекоммуникационных сетях, так и без использования таких средств.

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

    Фамилия, имя, отчество;

    Адрес электронной почты;

    Контактный телефон;

    Возраст;

    Иных персональных данных, указанных Пользователем в Формах или файлах, прикрепленных к Формам.

5. Цели обработки персональных данных:

    Идентификация Пользователя;

    Взаимодействие с Пользователем, в том числе направление уведомлений, запросов и информации, касающихся услуг Оператора, а также обработка запросов и заявок от Пользователя и установление обратной связи Пользователя с Оператором;

    Ответы на запросы Пользователей;

    Обеспечение работы Пользователя с Сайтом Оператора;

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

    Заключение с Пользователем договоров, в том числе трудовых и договоров на оказание юридических услуг;

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

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

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

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

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

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

10. Согласие может быть отозвано Пользователем путем направления письменного заявления в адрес Оператора (109240, г. Москва, улица Гончарная, дом 24) или путем направления письменного заявления на следующий адрес Корпоративной электронной почты: .

11. Настоящее Согласие действует все время до момента прекращения обработки персональных данных.

12. Понятия, которые используются в настоящем Согласии, должны трактоваться в соответствии с их определениями, которые даны в Федеральном законе от 27.07.2006 N 152-ФЗ «О персональных данных».