Я уже рассказывал о том, как вставить на сайт форму обратной связи без особых проблем. Однако, бывают ситуации, когда надо создать более сложную форму, например форму отправки заказа или форму онлайн заявки на сайте. Создать такую форму для HTML страницы, довольно таки не сложно, и даже не требуется особых знаний PHP - все понятно интуитивно.
Но есть одно маленькое НО. Ваш хостинг должен поддерживать PHP.
Итак. Для начала на HTML странице создадим форму. Я, для примера выбрал простую. Поля всегда можно добавить. Создать форму можно в ручную, или любым редактором типа FrontPage.
Там где будет вывод кода капчи пока ничего нет. Количесво полей, как я уже сказал можно добавить. Если поле обязательно для заполнения, то рядом с названием поля можно поставить знак, например звездочку. При желании можно изменить цвет формы, цвет и размер шрифтов.
Короче. В HTML страницу вставляем следующий код:
<div align="center">
<table border="1" width="365" align="center" cellpadding="20" cellspacing="6">
<tr>
<td>
<form action="http://ваш_сайт/options.php" method="post">
<p>Ваше имя:
<input type="text" name="fio" width="20"></p>
<p>Ваш e-mail:
<input type="text" name="email" width="20"></p>
<p>Текст сообщения:
<textarea name="money" cols="40" rows="5"></textarea></p>
<p>Введите числа с картинки:
<?php
$i=1;
do
{
$num[$i] = mt_rand(0,9);
echo "<img src='code/".$num[$i].".gif' border='0' align='bottom' vspace='5px'>";
$i++;
}
while ($i<5);
$captcha = $num[1].$num[2].$num[3].$num[4];
?>
<input name="captcha" type="hidden" value="<?php echo $captcha ;?>">
<input name="pr" style=" margin-bottom:11px" type="text" size="6" maxlength="4"></p>
<p><input type="submit" class="bt1" value="Отправить сообщение"></p>
</form>
</tr>
</td>
</table>
</div>
Допустим я добавлю еще одно поле Адрес.
<p>Адрес: <input type="text" name="adress" width="20" size="20"></p>
input type="text" - тип данных в поле (текст).
name="adress" - идентификатор поля
Как видно, поля Ваше имя и Ваш E-mail я решил сделать обязательными для заполнения.
Теперь подробней.
<form action="http://ваш_сайт/options.php" method="post"> - Для формы определяем действие (action) отрабатываемое в php-файле option.php. Сразу оговорюсь. Данный файл, вместе с рисунками капчи лучше поместить в отдельную папку, например code, и в файле robots.txt запретить поисковому роботу сканировать данную папку: Disallow: /code
Post - (метод) для отправки сообщения на почтовый ящик.
С полями, надеюсь, все ясно. А вот блок php-скрипта просто генерирует из папки code случайную комбинацию цифр-картинок. Вникать не имеет смысла.
Таким образом, весь код будет выглядеть уже так:
<div align="center">
<table border="1" width="365" align="center" cellpadding="20" cellspacing="6">
<tr>
<td>
<form action="http://ваш_сайт/options.php" method="post">
<p>Ваше имя:<font color="#FF0000">*</font>
<input type="text" name="fio" width="20"></p>
<p>Ваш e-mail:<font color="#FF0000">*</font>
<input type="text" name="email" width="20"></p>
<p>Адрес: <input type="text" name="adress" width="20" size="20"></p>
<p>Текст сообщения:
<textarea name="money" cols="40" rows="5"></textarea></p>
<p>Введите числа с картинки:
<?php
$i=1;
do
{
$num[$i] = mt_rand(0,9);
echo "<img src='code/".$num[$i].".gif' border='0' align='bottom' vspace='5px'>";
$i++;
}
while ($i<5);
$captcha = $num[1].$num[2].$num[3].$num[4];
?>
<input name="captcha" type="hidden" value="<?php echo $captcha ;?>">
<input name="pr" style=" margin-bottom:11px" type="text" size="6" maxlength="4"></p>
<p><input type="submit" class="bt1" value="Отправить сообщение"></p>
</form>
</tr>
</td>
</table>
</div>
Если вы просмотрите страницу в брайзере, то увидите примерно следующее:
Не пугайтесь. Эта абракадабра месте капчи - дело временное. Теперь вашу страницу с формой надо переименовать. Вернее не саму страницу, а только ее расширение. Например исходная страница была online.htm, получится - online.php
Все. Загрузив на сервер страницу и папку code с картинками-цифрами, вы увидите готовую к работе форму, с меняющейся при каждом запуске, комбинацией картинок капчи.
Теперь подготовим файл option.php.
Для начала проверяем, существуют ли переменные, которые передала форма обратной связи. Если не существуют, то мы их создаем. Если форма передала пустые значения мы их удаляем:
if (isset($_POST['fio'])) {$fio = $_POST['fio']; if ($fio == '') {unset($fio);}}
if (isset($_POST['email'])) {$email = $_POST['email']; if ($email == '') {unset($email);}}
if (isset($_POST['adress'])) {$adress = $_POST['adress']; if ($adress == '') {unset($adress);}}
if (isset($_POST['money'])) {$money = $_POST['money']; if ($money == '') {unset($money);}}
if (isset($_POST['pr'])){$pr = $_POST['pr']; if ($pr == '') {unset($pr);}}
if (isset($_POST['captcha'])){$captcha = $_POST['captcha'];}
Теперь проверяем, заполнены ли все обязательные поля (&& - логическое "и"):
if (isset($fio) && isset($email) && isset($money) && isset($pr))
{....
Как видите конструкция не закрыта и поле adress отсутствует. Если заданное условие выполняется, то убираем все лишние пробелы, а также преобразуем все теги HTML в символы.
$fio = htmlspecialchars(trim($fio));
$email = htmlspecialchars(trim($email));
$adress = htmlspecialchars(trim($adress));
$money = htmlspecialchars(trim($money));
Здесь же проверяем правильность ввода email-адреса:
if(!preg_match("/[0-9a-z_]+@[0-9a-z_^\.]+\.[a-z]{2,3}/i", $email))
{
echo "<p>Неправильный формат e-mail адреса!</p>";
}
А так же правильность ввода капчи:
if ($captcha == $pr)
{...
Как видите данная конструкция тоже не закрыта, т.к. последующие действия возможны только если капча верна.
При верно введенной капче формируем сообщение:
$address = "ваш e-mail";
$sub = "Сообщение с блога";
$mes = "Автор назвался: $fio \nПроживающий по адресу: $adress \nОставил такой E-mail: $email \n Текст сообщения: $money";
Вместо "ваш e-mail" указать ящик для получения сообщений.
В строке sub формирована тема письма.
И в результате работы строки mess получаем данные об отправителе и сообщение.
И наконец, проверив правильность данных, отправляем сообщение:
$verify = mail ($address,$sub,$mes,"Content-type:text/plain; charset = UTF-8\r\nFrom:$email");
if ($verify == 'true')
{
echo "<body bgcolor='609df9'>
<div style='margin-top: 30px'><table border='1' width='450' align='center' cellpadding='20' cellspacing='6' bgcolor='white'>
<tr>
<td>
<div style='margin'><div align='center'>Ваше сообщение успешно отправлено! <p>Вернуться на <a href='http://ваш_сайт'><font size='+1'>www.ваш_сайт</font></a></div>
<p><div align='center'>Я найду его, прочитаю и отвечу вам!</div>
<p><div align='right'><i><b>C уважением, Ваши Ф.И.О.</b></i></div>
</tr>
</td>
</table></div>";
}
else
{
echo "Сообщение не отправлено!";
}
}
else
{
echo "Вы не правильно ввели сумму чисел с картинки";
}
}
else
{
echo "Вы заполнили не все поля!";
}
?>
Ну вот в принципе и все. Архив с заготовками файлов и картинки капчи можно скачать здесь.
Но есть одно маленькое НО. Ваш хостинг должен поддерживать PHP.
Итак. Для начала на HTML странице создадим форму. Я, для примера выбрал простую. Поля всегда можно добавить. Создать форму можно в ручную, или любым редактором типа FrontPage.
Там где будет вывод кода капчи пока ничего нет. Количесво полей, как я уже сказал можно добавить. Если поле обязательно для заполнения, то рядом с названием поля можно поставить знак, например звездочку. При желании можно изменить цвет формы, цвет и размер шрифтов.
Короче. В HTML страницу вставляем следующий код:
<div align="center">
<table border="1" width="365" align="center" cellpadding="20" cellspacing="6">
<tr>
<td>
<form action="http://ваш_сайт/options.php" method="post">
<p>Ваше имя:
<input type="text" name="fio" width="20"></p>
<p>Ваш e-mail:
<input type="text" name="email" width="20"></p>
<p>Текст сообщения:
<textarea name="money" cols="40" rows="5"></textarea></p>
<p>Введите числа с картинки:
<?php
$i=1;
do
{
$num[$i] = mt_rand(0,9);
echo "<img src='code/".$num[$i].".gif' border='0' align='bottom' vspace='5px'>";
$i++;
}
while ($i<5);
$captcha = $num[1].$num[2].$num[3].$num[4];
?>
<input name="captcha" type="hidden" value="<?php echo $captcha ;?>">
<input name="pr" style=" margin-bottom:11px" type="text" size="6" maxlength="4"></p>
<p><input type="submit" class="bt1" value="Отправить сообщение"></p>
</form>
</tr>
</td>
</table>
</div>
Допустим я добавлю еще одно поле Адрес.
<p>Адрес: <input type="text" name="adress" width="20" size="20"></p>
input type="text" - тип данных в поле (текст).
name="adress" - идентификатор поля
Как видно, поля Ваше имя и Ваш E-mail я решил сделать обязательными для заполнения.
Теперь подробней.
<form action="http://ваш_сайт/options.php" method="post"> - Для формы определяем действие (action) отрабатываемое в php-файле option.php. Сразу оговорюсь. Данный файл, вместе с рисунками капчи лучше поместить в отдельную папку, например code, и в файле robots.txt запретить поисковому роботу сканировать данную папку: Disallow: /code
Post - (метод) для отправки сообщения на почтовый ящик.
С полями, надеюсь, все ясно. А вот блок php-скрипта просто генерирует из папки code случайную комбинацию цифр-картинок. Вникать не имеет смысла.
Таким образом, весь код будет выглядеть уже так:
<div align="center">
<table border="1" width="365" align="center" cellpadding="20" cellspacing="6">
<tr>
<td>
<form action="http://ваш_сайт/options.php" method="post">
<p>Ваше имя:<font color="#FF0000">*</font>
<input type="text" name="fio" width="20"></p>
<p>Ваш e-mail:<font color="#FF0000">*</font>
<input type="text" name="email" width="20"></p>
<p>Адрес: <input type="text" name="adress" width="20" size="20"></p>
<p>Текст сообщения:
<textarea name="money" cols="40" rows="5"></textarea></p>
<p>Введите числа с картинки:
<?php
$i=1;
do
{
$num[$i] = mt_rand(0,9);
echo "<img src='code/".$num[$i].".gif' border='0' align='bottom' vspace='5px'>";
$i++;
}
while ($i<5);
$captcha = $num[1].$num[2].$num[3].$num[4];
?>
<input name="captcha" type="hidden" value="<?php echo $captcha ;?>">
<input name="pr" style=" margin-bottom:11px" type="text" size="6" maxlength="4"></p>
<p><input type="submit" class="bt1" value="Отправить сообщение"></p>
</form>
</tr>
</td>
</table>
</div>
Если вы просмотрите страницу в брайзере, то увидите примерно следующее:
Не пугайтесь. Эта абракадабра месте капчи - дело временное. Теперь вашу страницу с формой надо переименовать. Вернее не саму страницу, а только ее расширение. Например исходная страница была online.htm, получится - online.php
Все. Загрузив на сервер страницу и папку code с картинками-цифрами, вы увидите готовую к работе форму, с меняющейся при каждом запуске, комбинацией картинок капчи.
Теперь подготовим файл option.php.
Для начала проверяем, существуют ли переменные, которые передала форма обратной связи. Если не существуют, то мы их создаем. Если форма передала пустые значения мы их удаляем:
if (isset($_POST['fio'])) {$fio = $_POST['fio']; if ($fio == '') {unset($fio);}}
if (isset($_POST['email'])) {$email = $_POST['email']; if ($email == '') {unset($email);}}
if (isset($_POST['adress'])) {$adress = $_POST['adress']; if ($adress == '') {unset($adress);}}
if (isset($_POST['money'])) {$money = $_POST['money']; if ($money == '') {unset($money);}}
if (isset($_POST['pr'])){$pr = $_POST['pr']; if ($pr == '') {unset($pr);}}
if (isset($_POST['captcha'])){$captcha = $_POST['captcha'];}
Теперь проверяем, заполнены ли все обязательные поля (&& - логическое "и"):
if (isset($fio) && isset($email) && isset($money) && isset($pr))
{....
Как видите конструкция не закрыта и поле adress отсутствует. Если заданное условие выполняется, то убираем все лишние пробелы, а также преобразуем все теги HTML в символы.
$fio = htmlspecialchars(trim($fio));
$email = htmlspecialchars(trim($email));
$adress = htmlspecialchars(trim($adress));
$money = htmlspecialchars(trim($money));
Здесь же проверяем правильность ввода email-адреса:
if(!preg_match("/[0-9a-z_]+@[0-9a-z_^\.]+\.[a-z]{2,3}/i", $email))
{
echo "<p>Неправильный формат e-mail адреса!</p>";
}
А так же правильность ввода капчи:
if ($captcha == $pr)
{...
Как видите данная конструкция тоже не закрыта, т.к. последующие действия возможны только если капча верна.
При верно введенной капче формируем сообщение:
$address = "ваш e-mail";
$sub = "Сообщение с блога";
$mes = "Автор назвался: $fio \nПроживающий по адресу: $adress \nОставил такой E-mail: $email \n Текст сообщения: $money";
Вместо "ваш e-mail" указать ящик для получения сообщений.
В строке sub формирована тема письма.
И в результате работы строки mess получаем данные об отправителе и сообщение.
И наконец, проверив правильность данных, отправляем сообщение:
$verify = mail ($address,$sub,$mes,"Content-type:text/plain; charset = UTF-8\r\nFrom:$email");
if ($verify == 'true')
{
echo "<body bgcolor='609df9'>
<div style='margin-top: 30px'><table border='1' width='450' align='center' cellpadding='20' cellspacing='6' bgcolor='white'>
<tr>
<td>
<div style='margin'><div align='center'>Ваше сообщение успешно отправлено! <p>Вернуться на <a href='http://ваш_сайт'><font size='+1'>www.ваш_сайт</font></a></div>
<p><div align='center'>Я найду его, прочитаю и отвечу вам!</div>
<p><div align='right'><i><b>C уважением, Ваши Ф.И.О.</b></i></div>
</tr>
</td>
</table></div>";
}
else
{
echo "Сообщение не отправлено!";
}
}
else
{
echo "Вы не правильно ввели сумму чисел с картинки";
}
}
else
{
echo "Вы заполнили не все поля!";
}
?>
Ну вот в принципе и все. Архив с заготовками файлов и картинки капчи можно скачать здесь.
