Create a simple contact form in PHP with MySQL

By Ujwal Kumar Sahoo

In this article, we will learn what is a contact form and how we can implement it using PHP. It requires an HTML page to get the data. So we will cover this article in 3 steps-

  1. Creating an HTML page
  2. Enhance the HTML page with CSS (*optional)
  3. Fetching and manipulating form data of the HTML page inside a PHP page.

What is the Contact form?

A contact form is a form where the user /client can post any query to the admin/server. The user leaves a comment and that comment is stored in the server-side database for review. After a successful review the admin contact and reply to that user.

This is how a contact form looks like,

Create a simple contact form in PHP with MySQL

Design an HTML page and CSS for the contact form in PHP

Let us create an HTML page that contains a form to hold the necessary data,

<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css" media="all" />
</head>
<body>
<h2>Contact Us</h2>
  
  <form class="form" action="contactform.php" method="POST">
    
    <p class="username">
      <input type="text" name="name" id="name" placeholder="Enter your name" >
      <label for="name">Name</label>
    </p>
    
    <p class="useremail">
      <input type="text" name="email" id="email" placeholder="mail@example.com" >
      <label for="email">Email</label>
    </p>
    
    <p class="usercontact">
      <input type="text" name="contact" id="contact" placeholder="contact no." >
      <label for="contact">Phone number</label>
    </p>		
  
    <p class="usertext">
      <textarea name="text" placeholder="Write something to us" ></textarea>
                        <label for="text">Comments</label>
    </p>
    
    <p class="usersubmit">
      <input type="submit" name="submit" value="Send" >
    </p>
  </form>
</body>
</html>

Let us design the form with CSS to enhance the user experience.

body {
  padding: 50px 500px;
  font-size: 13px;
    background-color: deepskyblue;
}

h2 {
  margin-bottom: 20px;
  font-family: fantasy;
    font-size: 40px;
}



input, textarea {
  padding: 10px;
  border: 1px solid #E5E5E5;
  width: 200px;
  color: #999999;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 8px;
      
}

textarea {
  width: 200px;
  height: 150px;
  max-width: 400px;
  line-height: 18px;
}

input:hover, textarea:hover,
input:focus, textarea:focus {
  border-color: 1px solid #C9C9C9;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 8px;	
}

.form label {
  margin-left: 10px;
  font-family:monospace;
    font-size: 15px;
}


.usersubmit input {
  width: 100px; 
  height: 40px;
  background-color: #474E69; 
  color: #FFF;
  border-radius: 3px;
    
}

Output:-

contact form

Note:-

It is completely optional to add a CSS file. It is used only for designing purposes.

Designing PHP page to fetch and store data in the database (MySQL)

Let us create a PHP page that can fetch data from the HTML page and store it in the database.

<?php 
  //creating connection to database
$con=mysqli_connect("localhost","root","","codespeedy") or die(mysqli_error());

  //check whether submit button is pressed or not
if((isset($_POST['submit'])))
{
  //fetching and storing the form data in variables
$Name = $con->real_escape_string($_POST['name']);
$Email = $con->real_escape_string($_POST['email']);
$Phone = $con->real_escape_string($_POST['contact']);
$comments = $con->real_escape_string($_POST['text']);

  //query to insert the variable data into the database
$sql="INSERT INTO contactus (name, email, phone, comments) VALUES ('".$Name."','".$Email."', '".$Phone."', '".$comments."')";

  //Execute the query and returning a message
if(!$result = $con->query($sql)){
die('Error occured [' . $conn->error . ']');
}
else
   echo "Thank you! We will get in touch with you soon";
}

?>

If there is no error in the HTML page, then after successful insertion of data the output message is  as follows,

Thank you! We will get in touch with you soon

Output in the database(Here it is MySQL database) is as follows,

contact form data stored in MySQL

Note:-

Here the name of our database is codespeedy and the table name is contactus.

This is how we can create a contact form in PHP. If you have any queries about the above topic, comment below.

See also,

7 responses to “Create a simple contact form in PHP with MySQL”

  1. chris says:
    February 6, 2020 at 3:59 am

    Hi,

    How can I configure the same form data to served on the database and sent to the sender and another copy to the website owners email?

    Reply
  2. phptechie says:
    July 28, 2020 at 2:37 pm

    Thanks for the great article. Really nice article and very clearly explained.

    Reply
  3. hayzeproductions says:
    April 9, 2021 at 1:15 pm

    Its in Line 8 on Index.html
    Also this article does not work on php 7.2 or 7.3. As simple as it is, you would think this would be easy setup. No, not today and not yesterday. Pretty sure the issues is php code related. You cannot use single line connection under contactform.php. Post author should consider making new article for php 7.0 up or updating this article.

    Reply
  4. tejashwini says:
    August 2, 2021 at 9:53 am

    php code is not working.how to run php code. i have named db codesdeey and table as contactus.after submit it shows code.and db is not saving.

    Reply
  5. snehal Renushe. says:
    August 27, 2021 at 10:40 pm

    Thank You for these blog,these will help me for further studies

    Reply
  6. Harvey says:
    February 26, 2022 at 8:20 am

    Hello, is this available to use in my contact page form html into my flask application?

    Reply

Leave a Reply

Your email address will not be published.