www.seomark.ru
Обзоры интересных и полезных программ, фотография, радио, веб-дизайн и т.д. и т.п. и др. и пр.
Веб-дизайн и поисковая оптимизация
Создание формы обратной связи - 1
• Создание формы обратной связи на сайте
• Проверка ввода формы обратной связи
• Создание анкеты на сайте
• Самая простая форма обратной связи
• Проверка формы обратной связи "на лету"
• Отправка файлов через форму обратной связи
• Капча в форме обратной связи
• Заказ товаров и услуг через форму обратной связи
• Форма обратной связи - примеры использования
• Форма обратной связи для заказа обедов в офис
• Форма обратной связи - отправка писем на разные адреса
• Проблемы с кодировкой в форме обратной связи
• Простая капча для формы обратной связи
• Создание кнопок в форме обратной связи
Создание формы обратной связи на сайте
В процессе продвижения сайта наряду с изучением статистики посещений, особое значение имеет информация о сайте от самих посетителей. Одним из самых простых способов получения такой информации является размещение на сайте странички с формой обратной связи. Посетитель оставляет сообщение, и оно придет на ваш адрес электронной почты или любой другой, который вы укажете. При этом посетителю не надо использовать свою почтовую программу, ему даже не обязательно иметь свой e-mail.
Простейший пример такой формы приведен на рис.1. (Это вполне рабочий образец, и вы можете с его помощью послать мне благодарственное письмо.)
Вы можете отправить мне сообщение, заполнив следующую форму:
Рис.1. Простая форма обратной связи
Для размещения на сайте такой формы обратной связи достаточно всего лишь элементарных сведений об HTML и умения оперировать двумя командами - Копировать и Вставить. Рассмотрим последовательность действий по созданию формы обратной связи (рис.1) на HTML-странице сайта.
1. Проверьте, что тарифный план вашего хостинга (контора, где размещён ваш сайт) поддерживает PHP. Если нет, то вам придётся скорее всего доплатить для перехода на другой тариф, поддерживающий эту самую PHP. Значение этой аббревиатуры можете не искать, так как знание PHP вам не понадобится.
2. Выберем страницу, на которой хотим разместить форму обратной связи. Для определенности назовём её contacts.html и вставим в нужное место следующий код:
<p style="color:#FF0000"> <strong>Вы можете отправить мне сообщение, заполнив следующую форму:</strong></p>
<form method="post" action="mail.php">
<strong>Ваше имя:</strong><br />
<input type="text" name="name" size="30"/>
<br />
<strong>Ваш e-mail (для ответа):</strong><br />
<input name="email" type="text" size="30" />
<br />
<strong>Ваше сообщение:</strong><br />
<textarea name="mess" rows="3" cols="30"></textarea>
<p>
<input type="submit" value="Отправить сообщение"/>
</p>
</form>
Как видим, вся форма создаётся тегом <form> с атрибутами action=mail.php (указание на страницу сайта, где расположен сценарий обработки введенных данных) и method=post (метод отправки данных на сервер). Отдельные строки созданы тегом <input> с вполне понятными атрибутами. Расположение отдельных элементов формы, текст, шрифты и проч. можете менять в соответствие с дизайном вашего сайта. Тег <textarea> задаёт размер области для ввода текста сообщения.
3. Создадим новую страницу mail.php, аналогичную обычной HTML, только имеющую расширение .php. Полный код страницы показан на рис.2:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251"/>
<title>Обратная связь</title>
</head>
<body>
<?php
if (isset($_POST['name'])) {$name = $_POST['name'];}
if (isset($_POST['email'])) {$email = $_POST['email'];}
if (isset($_POST['mess'])) {$mess = $_POST['mess'];}
if (empty($name))
{
echo "<b>Не указано имя!<p>";
echo "<a href=contacts.html>Вернуться к заполнению формы</a>";
exit;
}
if (empty($email))
{
echo "<b>Не указан e-mail!<p>";
echo "<a href=contacts.html>Вернуться к заполнению формы</a>";
exit;
}
if (empty($mess))
{
echo "<b>Сообщение не написано!<p>";
echo "<a href=contacts.html>Вернуться к заполнению формы</a>";
exit;
}
$to = "pupkin@rambler.ru"; /*УКАЗАТЬ СВОЙ АДРЕС!*/
$headers = "Content-type: text/plain; charset = windows-1251";
$subject = "Сообщение с вашего сайта";
$message = "Имя пославшего: $name \nЭлектронный адрес: $email \nСообщение: $mess";
$send = mail ($to, $subject, $message, $headers);
if ($send == 'true')
{
echo "<b>Спасибо за отправку вашего сообщения!<p>";
echo "<a href=index.html>Нажмите,</a> чтобы вернуться на главную страницу";
}
else
{
echo "<p><b>Ошибка. Сообщение не отправлено!";
}
?>
</body>
</html> Рис.2. Код страницы обработки формы обратной связи
Красным цветом выделены адреса ссылок, на которые необходимо обратить внимание:
- a href=contacts.html - заменить, если ваша страница с формой обратной связи называется не contacts.html,
- pupkin@rambler.ru - адрес г.Пупкина заменить на адрес вашей почты, куда будут поступать сообщения от посетителей сайта, а также неутомимых спамеров. Кстати, для защиты от них в форму часто вводят так называемую капчу (англ. CAPTCHA - Completely Automated Public Turing test to tell Computers and Humans Apart — полностью автоматизированный публичный тест Тьюринга для различия компьютеров и людей). Обычно это сильно искаженные цифры и буквы, которые просят ввести перед отправкой сообщения. О капче поговорим в одной из следующих статей.
Если вы хотите отправлять письма на несколько адресов, то просто перечислите их через запятую. - a href=index.html - адрес главной (домашней) страницы сайта.
Созданную страницу mail.php необходимо поместить в тот же каталог сайта (директорию, папку), где расположена и страница contacts.html.
Разместив на сайте страницы contacts.html и mail.php, проверьте работоспособность формы обратной связи. Если всё сделано аккуратно, то после заполнения формы и нажатия Отправить сообщение должен появиться следующий текст: "Спасибо за отправку вашего сообщения. Нажмите, чтобы вернуться на главную страницу". После этого вы обнаружите в своём почтовом ящике (или другом, который вы указали при создании формы обратной связи) собственное послание себе любимому.
Замечание: на некоторых хостингах новая (только что установленная на сайте) форма обратной связи начинает работать не сразу, и первые письма не доходят совсем или поступают с задержкой на 1-2 дня. Вероятно, идет "притирка шестеренок", а затем все работает нормально. Кроме того, с некоторых хостингов не доходят письма на определенные адреса, например, у меня были проблемы с ящиком на Рамблере. Для решения этих проблем обратитесь к вашему хостеру - обычно помогают.
Иногда при использовании описанной формы обратной связи возникают проблемы с кодировкой. Если в пришедшем письме вместо родной кириллицы текст состоит из "кракозяблов" или пустых квадратиков, то приходится вручную подбирать кодировку, что конечно же не удобно. Чтобы этого не происходило, проверьте, что ваша страница с формой обратной связи имеет кодировку charset=windows-1251. Если вы используете программу Adobe Dreamweaver, то для этого надо выбрать раздел меню Редактировать - Установки...- Создать документ - Кодировка по умолчанию. Подробнее проблема с кодировкой файлов сайта рассмотрена в статьях Проблемы с кодировкой в форме обратной связи и Самая простая форма обратной связи.
В описанном примере для простоты сообщение об отправке письма выводится на пустой странице. Конечно, вы можете разместить его на любой странице своего сайта, чтобы посетитель мог использовать навигацию (меню) для выбора дальнейших действий. Для этого поместите РНР-код (то, что расположено от <?php до ?>) в нужное место страницы с меню и измените её название на mail.php.
Кроме размещения самой формы обратной связи, желательно проверять правильность заполнения её полей посетителем. Это необходимо делать для того, чтобы ваш почтовый ящик не забивался хламом, отсылаемым шутниками, любящими просто понажимать кнопку Отправить сообщение. В описанном варианте формы обратной связи такая проверка выполняется на стороне сервера. Если эта проверка вам не требуется, то описанную форму обратной связи можно еще более упростить, о чем так же рассказано в статье Самая простая форма обратной связи.
Иногда удобнее проверку заполнения формы выполнять непосредственно в браузере пользователя до отправки формы, чтобы не загружать сервер и ускорить процесс проверки. Этот вариант рассмотрен в статье Проверка заполнения формы обратной связи на сайте.
18.10.2009 г.
см. все статьи по веб-дизайну >>
Copyright © 2008 - Марк Розенталь e-mail:
Перепечатка материалов сайта разрешается при условии сохранения имени автора и гиперссылки на www.seomark.ru