Contact Form Tutorial

Make a PHP Contact Form Form PHP



By Dylan on 10/3/2018

Contact Form

PHP

Check out my email sending service here.

If you are using a static website

If you are using a static website and you still want to have a contact form, please read this message. If you are not using a static website, skip to the introduction and carry on with the rest of the tutorial.
If you want to have a working contact form, you need to host your PHP somewhere else. Static websites don't support the use of PHP and therefore your contact form won't work. For example, you can set the action of your contact form to be to another url e.g: <form id="form" method="POST" name="contactform" action="http://YourURL"> . Now you have sent the data from your form to an external host, you can have your PHP file there and it will work fine. The only issue is finding some decent hosting with good sendmail limits.
If you are unable to find any suitable hosting you can always check out the service that I made here. It gives you the full control of making a form without having to code any of the backend.

Introduction

Everyone needs a contact form on their site, whether it be a personal website or a company website people need a way to get in touch. In this tutorial I will go over the simple way of doing this using PHP and HTML.
Lets get started by making our HTML contact form

HTML

index.html
          
<form id="form" method="POST" name="contactform" action="##">
  <input class="full" type="text" name="name" placeholder="Name">
  <input class="full" type="text" name="email" placeholder="[email protected]">
  <textarea class="fullarea" name="message"></textarea>
  <input id="submit" type="submit" value="Submit"><br>
</form>
          
        

In the above code we have made a very simple not working contact form. The contact form asks for your name, email, message and then has a submit button. Now we want to make it to work, which is a bit complicated if your new but hopefully you can understand this.

So, what we want to do is make what we call a form handler. What this does is it recieves all the inputs from the form and then does something with it - in this case sends us an email. Doing this using PHP allows us to send the email and have lots of controll over what we are doing. Note that if your web host doesn't support PHP this will not work. If your webhost doesn't support PHP there are a few ways around that, you can use another webhost that does and use the form externally or you can use a service like formspree but these services don't give you too much controll and limit the amout of emails you can send. To fix this I made my own version of formspree which you can find here. Anyway, lets make our handler.


PHP

contactHandler.php

          
<?php //1 
$errors = '';
$myemail = '[email protected]'; // 2<-----Put Your email address here.
if(empty($_POST['name'])  ||  // 3 
   empty($_POST['email']) || 
   empty($_POST['message']))
{
  $errors .= "\n Error: all fields are required"; // 3.1
}

$name = $_POST['name']; // 4
$email_address = $_POST['email']; // 5 
$message = $_POST['message']; // 5.1

// 6
if (!preg_match( 
"/^[_a-z0-9-]+(.[_a-z0-9-]+)*@[a-z0-9-]+(.[a-z0-9-]+)*(.[a-z]{2,3})$/i", 
$email_address))
{
  $errors .= "Error: Invalid email address";
}

if( empty($errors)) // 7
{
  $to = $myemail;  // 8
  $email_subject = "EMAIL SUBJECT";
  $email_body = "This is an example contact form \n".
  "\n Submitted By: $name \n Email: $email_address \n Message: $message"; 
  
  $headers = "From: $myemail\n"; 
  $headers .= "Reply-To: $email_address";
  
  mail($to,$email_subject,$email_body,$headers);

  header('Location:https://dylanturner.tech'); // 9
}
?>
          
        


Ok, So lets walk through what we are doing here. In the code I have put numbered comments which correspond to explenations here. Firstly we create our file called contactHandler.php

  1. We define our PHP code.
  2. This is the email we are sending the form to.
  3. This checks if any part of the form is empty, If it is empty it edits the errors string to display an error regarding filling in the fields (see // 3.1).
  4. We define our variables, $name now equals the input for name that the user submitted
  5. We do the same for out other inputs, assining them to variables (see 5.1)
  6. We now check to see if the email is legit, with a @ symbol and .
  7. If there are no errors, its now sends the email
  8. The email formatting, this basically puts in a subject line and displays the inputs.
  9. This is the page url for where to go once the form is successfully submitted.

Next:

So, we have got our processing php and our contact form. It doesn't work yet though as nothing is connected properly. To do this, we have to edit our HTML contact form so that it connects to the PHP.

HTML

index.html
          
<form id="form" method="POST" name="contactform" action="contactHandler.php">
  <input class="full" type="text" name="name" placeholder="Name">
  <input class="full" type="text" name="email" placeholder="[email protected]">
  <textarea class="fullarea" name="message"></textarea>
  <input id="submit" type="submit" value="Submit"><br>
</form>
          
        

All we had to do was change it so that the action is to contactHandler.php. We should now be all set for putting this onto our website!
Just a more in depth explination to why I am unable to make an example. I use free web hosting as I find its nice to not have to pay a cent. The issue is that most if not all free hosting providers put limits on how many emails you can send. If I were to make an example, it wouldnt work for long as I would reach the email limit very fast. I am also unable to use PHP with Github as Github hosts static websites and doesn't support PHP so therefore I can't really make a working example. Hopefully in the future I will be able to make a working example.

CSS

Notice, this tutorial doesn't include any CSS (so it will look pretty bad). Try adding your own basic css to style it nicely.


Last Updated: 4/9/2018, Created 10/3/2018

PHP 7.2
HTML 5
Tutorial Version 1