Hello. In this post we will discussing on how to create a contact form in php for your website with core php and this would mean that we would be coding our own contact form and not use any other client for that. And using this method you would be easily able to track the number of people who submitted your contact without having to use Google Analytics. And a point to note is that this form would display error messages in a good looking way.
For creating the contact form we would be using PHP for the server side part and we would be using twitter bootstrap for the design. And so the first part in creating the contact form is the markup and the design. The following will be the output of our markup code given below. You can edit the code to your needs.
NOTE : DO NOT CHANGE THE NAME ATTRIBUTE IN INPUT FIELDS ELSE YOU WOULD HAVE TO CHANGE THAT IN PHP CODE TOO
And now the markup is completed and the rest is to make it working with PHP. Make sure that if you are running this in your localhost then you need to configure your SMTP else if you are running it on a online server then it would mostly be pre-configured. Add the following code above the <!DOCTYPE HTML> in the markup code.
NOTE : Replace YOUR MAIL ID with the mail id where the user's mail has to be sent.
And that's it about creating the contact form ! Feel free to post your doubts below. Happy Coding :)
Creating The Contact Form :
For creating the contact form we would be using PHP for the server side part and we would be using twitter bootstrap for the design. And so the first part in creating the contact form is the markup and the design. The following will be the output of our markup code given below. You can edit the code to your needs.
CODE :
<!DOCTYPE HTML>
<link rel = "stylesheet" href = "libs/bootstrap.css">
<link href='http://fonts.googleapis.com/css?family=Monda' rel='stylesheet' type='text/css'>
<body style = "background-color: #4ea6e7;">
<center>
<div style = "background-color: #fff; border-radius: 20px; position: absolute; top: 10%; padding: 20px; width: 36%; left: 32%;">
<center><h2 style = "font-family: Monda;">CONTACT US !</h2></center>
<hr>
<?php
if(!empty($_GLOBALS['error'])){
echo "<div class = 'alert alert-danger'> " . $_GLOBALS['error'] . "</div>";
}
if(!empty($_GLOBALS['done'])){
echo "<div class = 'alert alert-success'> " . $_GLOBALS['done'] . "</div>";
}
?>
<form action = "" method = "post" class = "form-group">
<input type = "text" class = "form-control" name = "name" placeholder = "Name" style = "width: 100%;"><br>
<input type = "email" class = "form-control" name = "mail" placeholder = "Email" style = "width: 100%;"><br>
<textarea class = "form-control" name = "message" placeholder = "Message" style = "width: 100%; height: 150px; resize: none;"></textarea><br>
<input type = "submit" value = "Send Mail" class = "btn btn-primary">
</form>
</div>
</center>
</body>
NOTE : DO NOT CHANGE THE NAME ATTRIBUTE IN INPUT FIELDS ELSE YOU WOULD HAVE TO CHANGE THAT IN PHP CODE TOO
And now the markup is completed and the rest is to make it working with PHP. Make sure that if you are running this in your localhost then you need to configure your SMTP else if you are running it on a online server then it would mostly be pre-configured. Add the following code above the <!DOCTYPE HTML> in the markup code.
PHP CODE :
<?php
$_GLOBALS['error'] = "";
if(!empty($_POST)){
$name = $_POST['name'];
$email = $_POST['mail'];
$message = $_POST['message'];
if(empty($name) || empty($email) || empty($message)){
$_GLOBALS['error'] = "<b>Oops !</b> All Fields are Mandatory !";
}
else{
$_GLOBALS['error'] = "";
$message = $name . "<br><br>" . $message;
mail("YOUR MAIL ID","Contact Form",$message,"Content-type:text/html;charset=UTF-8\r\nFrom: $email\n");
$_GLOBALS['done'] = "<b>Success !</b> We'll get in touch with you soon !";
}
}
?>
NOTE : Replace YOUR MAIL ID with the mail id where the user's mail has to be sent.
And that's it about creating the contact form ! Feel free to post your doubts below. Happy Coding :)
0 comments:
Post a Comment