Сильный email для обратной связи. Создание формы обратной связи

Сам код файла form.php содержит в себе:

Вместо url=http://сайт пишем свой адрес сайта. $address = «[email protected]» — в данной строчке указываем свой адрес электронной почты, на которую будут приходить письма. Больше ничего менять не нужно, все настроено и работает. Если у вас возникли трудности в процессе установки, пишите в комментариях, я обязательно отвечу.

Вставка обратной связи в wordpress

Процесс установки формы в wordpress ничем не отличается, все действия делаются аналогично. Файл form.php желательно закачать в папку с вашей темой. Не забываем в html разметки указать полный и точный адрес к файлу обработчику. Кроме этого, нужно изменить адрес сайта на свой сайт и правильно написать адрес электронной почты. Код готовой формы можно вставить на любую страницу вашего блога. В качестве примера я добавил к себе на блог на страницу с конкурсами.

В качестве примера, можно создать страницу «Связаться с автором» или «Автор» и закинуть туда вашу форму. На некоторых блогах я замечал снизу каждой формы ряд из кнопок социальных сетей или дополнительные варианты связи с автором. Если есть желание, можно так же повторить. У меня на блоге форма связи работает, я проверял лично на своем примере. Если к вам письма не доходят, значит проблема с вашей стороны.

Плагины для wordpress

Если у вас возникли трудности с вставкой такой рода обратной связи на свой сайт, вы можете сказать один из плагинов и установить его на свой сайт. На сегодня существует большое количество плагинов, с помощью которых можно сделать такие формы для сайта. Заходим в панель администратора, нажимаем на Плагины — добавить новый. Выбираем любой, который вам понравится и пользуемся на здоровье. Больше популярностью пользуется плагин Contact Form 7.

1. Fast Secure Contact Form.
2. Contact Form by Contact ME.
3. FormCraft.
4. Visual Form Builder.
5. nForms – WordPress Form Builder.
6. Gravity Forms.

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

Возьмем для примера первый из них. Добавляем новый плагин Contact Form 7. Данный плагин очень простой, при работа с ним проблем возникнуть не должно. Многие блогера пользуются этим плагином для дополнительных мелких форм на своих сайтах. Переходи в консоли слева в пункт Contact Form 7 и нажимаем «добавить новую форму». Язык по умолчанию уже стоит русский.

В первой вкладке выбираем и называем поля, которые будут присутствовать. Не нужно делать очень большую форму, добавляем имя, почту, тему, сообщение и кнопку «отправить». В вкладке «Письмо» указываем ваш электронный ящик, на который будут приходить сообщения". Особых трудностей у вас возникнуть не должно, все интуитивно понятно.

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

Небольшой минус заключается в том, что дизайн вашей обратной связи будет в очень ужасном виде. Не стоит сильно расстраиваться. Заходим через ftp по данному адресу wp-content/plugins/contact-form-7/modules. В этой папке находятся все css стили плагина. Можно смело добавлять свои новые свойства, чтоб ваша форма была красивая и заметная.

Генератор формы обратной связи

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

• formdesigner;
• livetools.uiparade;
• Google Forms;
• iFormbuilder;
• faary.

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

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

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

1. Живое общение с клиентом.
2. Генераторы лидов.
3. Различные виджеты для обратного звонка.
4. Онлайн статистика.
5. Онлайн мониторинг.

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

» PHP Sendmail Script

PHPSendMail

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

| Скачано: раз

Simple PHP Send Mail

С этим очень ЛЁГКИМ php скриптом, посетители вашего сайта смогут отправлять письма непосредственно вам на почту через форму обратной связи.

| Скачано: раз

PHP + AJAX скрипт отправки форм на E-mail

Универсальный скрипт отправки данных из форм на email. Скрипт идеально подойдет для сайтов типа Landing Page, сайтов визиток и т.д.

| Скачано: раз

PHP Mailer Final с капчей

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

| Скачано: раз

GentleSource Form Mail

На ваш выбор две опции: или пользователь при помощи редиректа попадает на Thank-You-Page с вашим текстом или же, пользователю отображается информация, о том, что сообщение успешно отправлено.

| Скачано: раз

Micro Mailer

Micro Mailer – это не большой PHP скрипт, который позволяет вам и посетителям вашего сайта отправить письмо любому адресату.

| Скачано: раз

Web4you-FM

Web4you-FM Отправка письма с вашего сайта. Возможности: 1 - Выбор адресата и сколько их будет (от 1 до 4). 2 - Проверка на корректность заполнения формы. Кому. Имени, только буквы...

| v.1.0 | Скачано: раз

Light PHP Contact Form

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

| Скачано: раз

DodosMail

DodosMail – это простой в установке PHP скрипт, который позволяет отправлять письма через форму обратной связи, на вашем сайте. Вам просто нужно загрузить php файл.

| v.2.5 | Скачано: раз

PHP Contact Form

Скрипт PHP Contact Form включает в себя следующие функции: 1) функция предотвращения спама. Пользователь должен ввести защитный код, также известный как капча.

| Скачано: раз

TPCS Contact (email form)

Этот TPCS Contact скрипт, позволит вашим посетителям связаться с вами через форму обратной связи. Вся информация будет отправлена вам на электронную почту.

| Скачано: раз

Feedback mailer

Feedback mailer перенаправляет всю информацию из формы обратной связи на вашем сайте, напрямую к вам на почту. Этот маленький скрипт очень быстро обрабатывает все запросы.

| v.1.2 | Скачано: раз

Easy PHP Contact Form

Простой, но безопасный PHP скрипт контакта с вебмастером при помощи формы обратной связи с проверкой кода (КАПЧА) для предотвращения спама.

| v.2.1 | Скачано: раз

PHP Contact form (with image verification)

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

| Скачано: раз

CW3 Form Mail

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

| v.3.30 | Скачано: раз

reCAPTCHA Contact Form

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

| v.1.4 | Скачано: раз

phMailer

phMailer – это очень простой PHP скрипт обратной связи, который поддерживает функцию прикрепления файла (attachments) благодаря встроенной mail() function языка PHP.

Одной из наиболее часто встречающихся на практике задач является реализация формы обратной связи. Тобишь написание ее HTML кода, оформление ее на CSS, создание PHP скрипта, который бы обрабатывал полученные от пользователя данные и отправлял их на нашу почту, написание JS скрипта, который бы проверял форму на адекватность вводимых данных, защита нашего детища от спама, чтобы наш почтовый ящик не обвалился от атак ботов.

Все вышеперечисленные моменты будут рассмотрены в нашем обзоре и подробно прокомментированы.

Итак, начинаем создание формы обратной связи:

HTML

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

< form method= "post" action= "mail.php" > < div class = "left" > < label for = "name" > Имя: < input maxlength= "30" type= "text" name= "name" /> < label for = "phone" > Телефон: < input maxlength= "30" type= "text" name= "phone" /> < label for = "mail" > E- mail : < input maxlength= "30" type= "text" name= "mail" /> < div class = "right" > < label for = "message" > Сообщение: < textarea rows= "7" cols= "50" name= "message" > < input type= "submit" value= "Отправить" />

И визуально она выглядит сейчас следующим образом:

Согласен, пока все некрасиво и ничего не понятно, но мы только начали.

Рассмотрим приведенный выше код подробно:

• < form method= "post" action= "mail.php" > …

  
  для того, чтобы создать форму необходимо использовать тег form. Именно он определяет начало и конец формы для интерпретатора кода. У него, как и у любого тега, есть целый набор атрибутов, но обязательных для работы формы всего два, это method (метод отправки запроса на сервер, для форм стандартно используют post) и action (указывает путь к файлу-обработчику формы, именно в этом файле будет содержаться скрипт на PHP, который после будет отправлять введенные пользователем значения нам на почту, в нашем случае мы видим, что это файл называется mail.php и лежит он в том же директории сайта, что и рассматриваемая нами страница).

• < input maxlength= "30" type= "text" name= "name" />

  
  Далее у нас следуют инпуты. Это собственно сами поля формы в которые пользователи будут вводить необходимую нам информацию (type="text" говорит о том, что это будет текст). Атрибут maxlength указывает сколько символов может ввести пользователь в данное поле формы. Самый важный атрибут это name – он задает имя конкретного поля. Именно по этим именам в дальнейшем PHP скрипт будет обрабатывать поступающую в него информацию. При желании можно еще задать атрибут placeholder, который выводит внутри поля текст исчезающий при установке курсора внутри нее. Одной из проблем плейсхолдера является то, что он не поддерживается некоторыми старыми браузерами.

• < label for = "name" > Имя:

  
  Используется в случае если мы отказались от плейсхолдеров. Обычная подпись поля, атрибут for сообщает к какому конкретно полю относится данная подпись. Значением указывается name интересующего нас поля.

• < textarea rows= "7" cols= "50" name= "message" >

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

• < input type= "submit" value= "Отправить" />

  
  О том, что это кнопка для отправки формы нам сообщает type="submit", а value задает текст, который будет внутри этой кнопки.

• < div class = "right" >

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

CSS

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

Мы использовали данный код:

form { background: #f4f5f7; padding: 20px; } form . left, form . right { display: inline- block; vertical- align: top; width: 458px; } form . right { padding- left: 20px; } label { display: block; font- size: 18px; text- align: center; margin: 10px 0px 0px 0px; } input, textarea { border: 1px solid #82858D; padding: 10px; font- size: 16px; width: 436px; } textarea { height: 98px; margin- bottom: 32px; } input[ type= "submit" ] { width: 200px; float: right; border: none; background: #595B5F; color: #fff; text- transform: uppercase; }

Подробно расписывать CSS я не вижу смысла, обращу Ваше внимание лишь на ключевые моменты:

1. Не стоит писать оформление под каждый тег в форме. Старайтесь строить свои селекторы так, чтобы парой строк кода оформлять все необходимые Вам элементы.
2. Не используйте для переноса строк и создания отступов лишние теги по типу < br>, < p> и тд, с этими задачами прекрасно справляется CSS со свойством display: block и margin с padding. Больше о том, почему не стоит пользоваться < br> в верстке вообще можете почитать в статье Тэг br, а так ли он нужен? .
3. Не стоит пользоваться табличной версткой для форм. Это противоречит семантике этого тега, а поисковики любят семантичный код. Для того, чтобы формировать визуальную структуру документа нам достаточно тегов div, и заданных им в CSS свойств display: inline-block (выстраивает блоки в ряд) и vertical-align: top (не дает им разбежаться по экрану), задаем им необходимую высоту и вуаля, ничего лишнего и все расположено так, как нам нужно.

Для желающих экономить свое время на оформлении сайтов могу посоветовать пользоваться CSS фреймворками при создании сайтов, особенно самописных. Мой выбор в этом плане- Twitter Bootstrap . Урок по оформлению форм с его использованием можно посмотреть .

PHP

Ну вот и пришло время сделать нашу форму работоспособной.

Заходим в наш корневой каталог сайта и создаем там файл mail.php, к которому мы ранее указывали путь в атрибуте action тега form.

В конечном итоге его код будет выглядеть следующим образом:

\" javascript: history.back()\" >Вернуться назад

Обсуждение HTML и CSS части этого документа можно пропустить. По своей сути это обычная страница сайта, которую Вы можете оформить по своему желанию и необходимости. Рассмотрим же важнейшую ее часть – PHP скрипт обработки формы:

$back = "

\" javascript: history.back()\" >Вернуться назад

Этой строкой мы создаем ссылку для возвращения на предыдущую страницу. Поскольку мы заранее не знаем с какой страницы пользователь попадет на эту, то делается это при помощи маленькой JS функции. В дальнейшем мы просто будем обращаться к этой переменной для вывода ее в нужных нам местах.

if (! empty ($_POST [ "name" ] ) and ! empty ($_POST [ "phone" ] ) and ! empty ($_POST [ "mail" ] ) and ! empty ($_POST [ "message" ] ) ) { //внутрення часть обработчика } else { echo "Для отправки сообщения заполните все поля! $back " ; exit ; }

Тут мы прикручиваем проверку формы на наполненность полей. Как вы догадались, в части $_POST["name"] в кавычках мы пишем значение атрибута name наших инпутов.

Если все поля заполнены, то скрипт начнет обрабатывать данные в своей внутренней части, если же хоть одно поле не было заполнено, то на экран пользователя выведется сообщение с требованием заполнить все поля формы echo "Для отправки сообщения заполните все поля! $back" и ссылкой для возврата на предыдущую страницу, которую мы создали самой первой строкой.

Дале вставляем во внутреннюю часть обработчика формы:

$name = trim (strip_tags ($_POST [ "name" ] ) ) ; $phone = trim (strip_tags ($_POST [ "phone" ] ) ) ; $mail = trim (strip_tags ($_POST [ "mail" ] ) ) ; $message = trim (strip_tags ($_POST [ "message" ] ) ) ;

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

Проверки можно и усложнить, но это уже по вашему желанию. Минимальную защиту на серверной стороне мы уже поставили. Дальнейшее мы сделаем на стороне клиента используя JS.

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

После чистки тегов добавляем отправку сообщения:

mail ("почта_для_получения_сообщений@gmail.com" , "Письмо с адрес_вашего_сайта" , "Вам написал: " . $name . "
Его номер: " . $phone . "
Его почта: " . $mail . "
Его сообщение: " . $message , "Content-type:text/html;charset=windows-1251" ) ;

Именно эта строка и занимается формированием и отправкой сообщения к нам. Заполняется она следующим образом:

1. "почта_для_получения_сообщений@gmail.com" – сюда между кавычек вставляете свою почту
2. "Письмо с адрес_вашего_сайта" – это тема сообщения, которое будет приходить на почту. Можно написать сюда что угодно.
3. "Вам написал: ".$name." < br /> Его номер: ".$phone." < br /> Его почта: ".$mail." < br /> Его сообщение: ".$message – формируем сам текст сообщения. $name – вставляем информацию заполненную пользователем через обращение к полям из предыдущего шага, в кавычках описываем что значит это поле, тегом < br /> делаем перенос строки, чтобы сообщение в целом было читабельно.
4. Content-type:text/html;charset=windows-1251 - в конце идет явное указание типа данных передаваемого в сообщении и его кодировки.

ВАЖНО!

Кодировка указанная в «голове» документа ( < meta http- equiv= "Content-Type" content= "text/html; charset=windows-1251" /> ), кодировка из сообщения Content-type:text/html;charset=windows-1251 и в целом кодировка файла PHP должны совпадать иначе в получаемых на почту сообщениях вместо русских или английских букв будут выводиться «кракозябры».

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

Проверка формы на адекватность вводимых данных

Чтобы пользователи по невнимательности не промахивались полями и заполняли все корректно стоит поставить проверку вводимых данных.

Это можно сделать как на PHP на стороне сервера, так и на JS на стороне клиента. Я использую второй вариант, поскольку так человек сразу может узнать что он сделал не верно и исправить ошибку не делая дополнительных переходов по страницам.

Код скрипта вставляем в том же файле, где у нас располагается HTML часть формы. Для нашего случая он будет выглядеть так:

< script> function checkForm(form) { var name = form. name. value; var n = name. match(/ ^[ A- Za- zА- Яа- я ] * [ A- Za- zА- Яа- я ] + $/ ) ; if (! n) { alert("Имя введено неверно, пожалуйста исправьте ошибку" ) ; return false ; } var phone = form. phone. value; var p = phone. match(/ ^[ 0 - 9 + ] [ 0 - 9 - ] * [ 0 - 9 - ] + $/ ) ; if (! p) { alert("Телефон введен неверно" ) ; return false ; } var mail = form. mail . value; var m = mail . match(/ ^[ A- Za- z0- 9 ] [ A- Za- z0- 9 \. _- ] * [ A- Za- z0- 9 _] *@ ([ A- Za- z0- 9 ] + ([ A- Za- z0- 9 - ] * [ A- Za- z0- 9 ] + ) * \. ) + [ A- Za- z] + $/ ) ; if (! m) { alert("E-mail введен неверно, пожалуйста исправьте ошибку" ) ; return false ; } return true ; }

Ну а теперь обычный разбор:

Для того, чтобы при нажатии на кнопку отправки формы, у нас происходила ее проверка вешаем запуск нашего скрипта на тег form:

< form method= "post" action= "mail.php" onSubmit= "return checkForm(this)" >

Теперь по пунктам забираем состав проверки:

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

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

На сегодняшний день, , является в структуре лендинг пейдж. Ведь это один из способов принять заказ или отправить каталог вашей продукции, предварительно получив e-mail посетителя.

Создание формы обратной связи – html разметка

Обычно мне хватает трех полей, и в большинстве случаев, я использую такую разметку для создания контактной формы:

Получить прайс

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

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


Создание формы обратной связи — css разметка

Давайте зададим стили нашей форме и приведем ее к читабельному виду:

/* Стили формы */ #application { width: 475px; margin: 0 auto; } /*Стили полей для ввода*/ #applicationName, #applicationEmail, #applicationTelephone { width: 100%; height: 73px; background: none; margin-top: 25px; border: 1px solid #fff; border-radius: 40px; text-align: center; color: #fff; font-size: 24px; } /*Стили полей при клике по ним*/ #applicationName:focus, #applicationEmail:focus, #applicationTelephone:focus { border: 1px solid #30ad64; } /*Стили текста, выводящегося в placeholder*/ ::-webkit-input-placeholder { color: #efefef; font-family: "PT Sans", sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); } ::-moz-placeholder { color: #fff; font-family: "PT Sans", sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); } /* Firefox 19+ */ :-moz-placeholder { color: #fff; font-family: "PT Sans", sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); } /* Firefox 18- */ :-ms-input-placeholder { color: #fff; font-family: "PT Sans", sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); } ::placeholder { color: #fff; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); } /*Стили для кнопки*/ .applicationButton { margin-top: 25px; background: #30ad64; border: none; width: 100%; height: 73px; border-radius: 40px; color: #fff; font-size: 24px; text-transform: uppercase; font-family: "PT Sans", sans-serif; cursor: pointer; } .applicationButton:hover { background: #d68c18; }

Если хотите, чтобы цвет кнопки менялся плавно, добавьте в.applicationButton и.applicationButton:hover такую строку:

Transition: .6s;

Где.6s — время анимации в миллисекундах.
Теперь наша форма приобрела красивый вид, сейчас она выглядит так:

Создание формы обратной связи — php разметка

Теперь нам необходимо создать файл application.php. Он будет получать введенные параметры из формы и отправлять их к нам на почту.

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

То есть, когда пользователь нажмет кнопку, его перекинет на страницу application.php. Это полноценная страница, и вы должны оформить ее соответствующим образом.

"; $msg .= "

Cообщение с сайта

От кого: ".$username."

Почта: ".$usermail."

Сайт: ".$usertel."

Давайте немного поясню код:

$sendto = "[email protected]"; // почта, на которую будет приходить письмо $username = $_POST["name"]; // сохраняем в переменную данные полученные из поля c именем $usertel = $_POST["telephone"]; // сохраняем в переменную данные полученные из поля c телефонным номером $usermail = $_POST["email"]; // сохраняем в переменную данные полученные из поля c адресом электронной почты

Тут, думаю, — понятно.

Теперь давайте сформируем заголовок письма.

$subject = "Новое сообщение"; $headers = "From: " . strip_tags($usermail) . "\r\n"; $headers .= "Reply-To: ". strip_tags($usermail) . "\r\n"; $headers .= "MIME-Version: 1.0\r\n"; $headers .= "Content-Type: text/html;charset=utf-8 \r\n";

Строка $subject = «Новое сообщение»; — отвечает за тему письма, может написать там: «Заявка с сайта» или то, что вам больше подходит.

Предлагаю сделать так, чтобы письмо приходило, от адреса, указанного в поле input type=»email». То есть с того, с которого пользователь ввел при заполнении формы. Для этого пропишем следующие строки:

$headers = "From: " . strip_tags($usermail) . "\r\n";

То есть мы подставим данные из переменной $usermail, где и хранится информация из поля, отвечающего за ввод email адреса.

Теперь зададим внешний вид письма. Вы можете оформить его как угодно, а я предлагаю следующую структуру:

$msg = ""; $msg .= "

Cообщение с сайта

От кого: ".$username."

Почта: ".$usermail."

Телефон: ".$usertel."

Первой строкой задаем шрифт письма. Второй — выводим сообщение, например: «Заявка с формы обратной связи на первом экране». Третей, четвертой и пятой строкой передаем данные из формы. Каждая с новой строки.

Теперь нужно отправить письмо функцией mail и определить, что будет происходить при успешной и не успешной отправки письма:

If(@mail($sendto, $subject, $msg, $headers)) { echo "

Я сделал так, что в любом из случаев выведется картинка с соответствующим текстом. Вы можете вместо картинки вывести полноценную страницу. Просто пропишите код, вместо картинки.

Через несколько секунд, после вывода изображения, я делаю редирект (автоматическое перенаправление) на главную страницу. Сделать это можно, вписав следующую строку между тегами head;

То есть через 4 секунды пользователя автоматически вернет на главную страницу!

Я не эксперт в php — это back-end язык программирования, меня всю жизнь тянуло к изучению front-end. Поэтому не судите строго. Да, здесь можно сделать проверки на заполнение контактных форм и так далее, но мне всегда хватало и этого, так что, если у кого-то есть предложение как улучшить этот код, напишите пожалуйста в комментариях или на почту, поправлю урок, спасибо!

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

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

P.s. Так как я стал очень часто получать вопросы о том, почему не работает форма и не приходят письма на почту, то решил описать несколько наиболее популярных причин, по которым это может происходить:

• Тестируете форму не на сервере.
• Тестируете форму на бесплатном хостинге.
• Тестируете форму на платном хостинге, но в бесплатном тестовом периоде.

В этих случаях письма не будут приходить к вам на почту.

Если вам лень разбираться и самостоятельно делать форму, то рекомендую обратить внимание на .

23/07/2014 12/07/2018

dimadv7

От автора: приветствую вас, друзья. Данная статья будет продолжением , в которой мы реализовывали отправку данных формы на сервер без перезагрузки страницы. Здесь мы продолжим данную тему и узнаем, как принять данные на сервере и реализовать отправку формы на электронную почту (email). Итак, давайте настроим форму обратной связи и добавим возможность ее отправки на email.

Исходные файлы текущей статьи вы можете скачать по .

В этом уроке мы сделаем все максимально просто и своими силами. В частности, для отправки писем мы воспользуемся специальной функцией PHP под названием mail(), которая раньше часто использовалась для отправки писем.

Начнем с синтаксиса функции mail . Данная функция имеет три обязательных параметра и два опциональных (не обязательных). Обязательные параметры:

to — email получателя (также можно указать несколько адресов, перечислив их через запятую);

subject — тема письма;

message — текст письма.

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

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

Ваше сообщение отправлено

Ошибка!

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

Как видим, код работает, в ответ мы получаем сообщение о том, что письмо отправлено. Поскольку мы работаем на локальном сервере, здесь письма реально не отправляются функцией mail(), они сохраняются в виде текстового файла в специальной папке. В Open Server это папка \userdata\temp\email\. Откроем эту папку и убедимся, что письмо там есть, примерно так оно будет выглядеть:

Отлично! Осталось несколько моментов, которые не помешает поправить в JS скрипте. Например, необходимо выводить сообщение не простым текстом, а именно кодом HTML, а также очищать поля формы после отправки сообщения. Итоговый JS код будет таким:

$(function(){ $("#recall").submit(function(e){ e.preventDefault(); var data = $(this).serialize(); $.ajax({ url: "mail.php", type: "POST", data: data, beforeSend: function(){ $("#submit").next().text("Отправляю..."); }, success: function(res){ $("#recall").find("input").val(""); $("#submit").next().html(res); }, error: function(){ alert("Ошибка!"); } }); }); });