Форма обратной связи с защитой от ботов на сайт: HTML, CSS, PHP код

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

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

HTML-код

<div id="send_question">
	<h2>Задать вопрос</h2>
	<form method="post" action="send_question.php?type=question">
		<input type="text" id="name" name="name" placeholder="Имя" >
		<input type="email" id="email" name="email" placeholder="Электронная почта">
		<textarea id="question" name="question" placeholder="Ваш вопрос"></textarea>
		<input type="text" id="check_bot" name="check_bot">
		<div id='solve_it'>
			<?php
				$num_array = array("нолик", "единичка", "двоечка", "троечка", "четверочка", "пятерочка", "шестерочка", "семерочка", "восьмерочка", "девяточка");
				$a = rand(1, 9);
				$b = rand(1, 9);
				$result = $a + $b;
				$_SESSION['result'] = $result;
				echo $num_array[$a]. " + ". $num_array[$b] ." = "; 
			?>
		</div><input type="text" id="solve_it_result" name="solve_it_result" placeholder="Ответ числом" >
		<input type="submit" value="Отправить">
	</form>
</div>

CSS-код

input, textarea
{
	display: block;
	width: 80%;
	height: 60px;
	margin-left:auto;
	margin-right:auto;
}

input[type=text], input[type=email], input[type=textarea], textarea
{
	font: 300 15px/21px pragmatica,Helvetica,Arial,sans-serif;
	font-family: pragmatica, Helvetica, Arial, sans-serif;
	font-size: 1.20em;
	text-align:center;
	color:#BFBFBF;
	border-radius: 4px;
	margin-top:10px;
	margin-bottom:10px;
}

#question
{
	height: 110px;
	font-size: 1.20em;
}

#solve_it
{
	margin-left: auto;
	margin-right:auto;
	display:block;
	font: 300 15px/21px pragmatica,Helvetica,Arial,sans-serif;
	font-family: pragmatica, Helvetica, Arial, sans-serif;
	font-size: 1.20em;
	text-align:center;
}

#check_bot
{
	display:none;
}

input[type=submit]
{
	font-size: 1.15em;
	text-transform: uppercase;
	color: #EEEEEE;
	border-radius: 4px;
	background-color:#5C5C5C;
}

PHP-код. Располагается на соответствующей странице send_question.php

<?php

function send_mail($name, $email, $question) {
	$to = 'email@yandex.ru';
	
	$subject = 'Вопрос с сайта VIRAND';
	
	$message = "
	<html>
	<head>
  	<title>ВОПРОС</title>
	</head>
	<body>
	  <table>
		<tr>
		  <td>Имя: </td><td>$name</td>
		</tr>
		<tr>
		  <td>E-mail: </td><td>$email</td>
		</tr>
		<tr>
		  <td>Вопрос: </td><td>$question</td>
		</tr>
	  </table>
	</body>
	</html>
	";
	
	$headers  = 'MIME-Version: 1.0' . "\r\n";
	$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
	
	mail($to, $subject, $message, $headers);
}


switch($_GET['type'])
{
	case 'question':
		if ($_POST['solve_it_result'] == $_SESSION['result']) {
			send_mail($_POST['name'], $_POST['email'], $_POST['question']);
			echo "<h2>Проверочный код введен верно. Вопрос отправлен.<br> Спасибо!)</h2>"; }
		else
			echo "<h2>Извините, Вы неправильно ввели проверочный код. Вопрос не отправлен.</h2>";
	break;

	default:
		echo "<h2>Это системная страница. Тут ничего интересного нет :(</h2>";
	break;
}
?>

Вам будет интересно:

HTML5 шпаргалка HTML5 - язык гипертекстовой разметки. Язык HTML интерпретируется браузерами. Полученный форматированный текст отображается на экране устройства. Данна...

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *