Are you ready? Let’s get started!

Many WordPress plugins come with fully functional contact forms that can be installed and used right away, but we believe in beautiful design and in your right to style it however you choose. Therefore the first video will focus on how to create, but mainly how to style, your contact form using CSS3.

There is not much HTML5 in this video tutorial, as the contact form is built with code available in previous versions of HTML, but you can use this first video tutorial as a way to reinforce many of the things we learned together in the previous tutorials. So without any further discussion, here it is.

Contact Form HTML and CSS Tutorial For Dummies

What you will learn:

  • the basics of CSS3 styling
  • how to create an HTML5 contact form
  • how to create an elegant CSS3 contact form

create-css3-contact-form

By the end of this HTML contact form tutorial, you will have something similar to the screenshot above. Feel free to view the demo just after the video tutorial to get a feel of what you will be making in under 25 minutes. It’s a good exercise for both beginners and experts alike!

View the Demo and Download the Source Files.

Challenge: Making Contact Form Responsive and Validation

Can you make this contact form responsive? I will give you a hint, but it will be somewhat irrelevant to a contact form, but surely you are smart enough to work your way through it, yes?

Hint: It’s all about the media queries!

Of course, it is crucial that you validate the fields so that you will not receive any unnecessary information, or secure that all the information you need from your contact form are all useful. In order to do that, you will need to include HTML5 validation in your code. It is pretty easy to do, all you need is patience and the willingness to test new stuff!

How to Make the Contact Form HTML Work

Although making it functional will require a little bit of server-side programming, I’ll be glad to point you in the right direction!

To make this form function for your website, you’ll need to code it with PHP.

Note: the PHP contact form tutorial focuses on just making it work functionally, but you will just need to add security features to it yourself (Google it!).

Good luck!

contact-form-html-php-tutorial

I am sure that almost everyone can agree on the importance of contact forms for use on everything from static HTML websites to WordPress powered websites. I found myself many times creating custom PHP contact forms for clients and always changing things around to suit the needs of the client.

After going through this tutorial, you should have a better understanding of creating custom PHP contact forms. These can be really useful in your own projects, as well as projects for clients.

I have used these for basic contact forms, surveys, and even to create simple help desk ticket systems for clients. The list is endless, just be creative. I will discuss everything that you will need to know to make your own custom HTML and PHP forms.

View the Demo and Download the Source Files.

How To Create a Simple PHP Contact Form

First things first – To create a form in our HTML document, we will need to select the location we will be placing the form. Generally, most forms will start with:

<form>

and end with the closing tag of:

</form>

The form action will tell this form what to look for when the submit button is pressed. In this example, we will be working with below, this is a second file that we will be creating called mail.php

The beginning line of our code that begins our form shows our action of mail.php – and the method of POST – which will trigger the PHP script to send the email when the forms are filled out, and the submit button is pressed.

Action and Method of mail.php

<form action="mail.php" method="POST">

The last thing we will need to understand before starting our form is the use of INPUT – which will tell browsers to allow an input of text type, to complete a field. Using this along with textarea will allow us to create our form and create a space for users to input information that we will later use PHP to send via email.

Each one of these areas we create on our form will be given a NAME that we will also be using on our PHP document to mark the information being sent.

Taking a Look at Contact Form

Now let’s begin our example. We will create a very simple starting point that I will show you how to modify for your own needs. Understanding the code and how it works will help you use it better and help ensure you have less problems when placing this on a live website.

I will start with a very basic contact form to get us started. Here is the basic HTML that we will use to create our contact form.

HTML Form Code

<form action="mail.php" method="POST">
<p>Name</p> <input type="text" name="name">
<p>Email</p> <input type="text" name="email">
<p>Message</p><textarea name="message" rows="6" cols="25"></textarea><br />
<input type="submit" value="Send"><input type="reset" value="Clear">
</form>

Using the code above – You can insert this directly into your HTML document to create the form itself. Later we will look at modifying this more and creating something a little more custom.

Contact Form PHP: How To Actually Create It?

Now, to make our form work, we will need to use a little PHP. This part is actually easier than most people think. We will be using the PHP $_POST function, and creating labels for each name that we have created in our form. This will allow us to further customize the form later on as well.

Now we will create our mail.php file – This is what will generate the email from the form and actually mail it:

mail.php

<?php $name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$formcontent="From: $name \n Message: $message";
$recipient = "[email protected]";
$subject = "Contact Form";
$mailheader = "From: $email \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
echo "Thank You!";
?>

Notice our three name tags we have created. We have Name, Email, and Message. These are the three that we created in our form. This is the information that will be sent from our contact form via email.

The $recipient area will need to be modified to fit YOUR email address where you wish to have the email sent to. You can also modify the other information as needed such as the subject, and success message. We will get more into these later when we begin customizing the form even more.

Add More Customization To Contact Form

Now since we have the basic idea of the contact form HTML, and tying it together with our PHP to create a basic contact form, I will begin to go a step further and now show how you can customize this form even more to fit your needs for your project.

I will show how to add a dropdown option box, and explain adding checkboxes or radio buttons for selection items to be chosen, and emailed from the form.

Adding Dropdown Option Boxes

To add a dropdown box, we will need to add the section within our HTML code to create the area for the form, as well as add the proper code to our PHP to recognize the input from the HTML and be able to send it.

Here is a simple example HTML contact form dropdown box:

<p>Dropdown Box</p>
<select name="dropdown" size="1">
<option value="Option1">Option1</option>
<option value="Option2">Option2</option>
<option value="Option3">Option3</option>
<option value="Option4">Option4</option>
</select>
<br />

In the example above, we have created a dropdown box with options 1 through 4. The option value will be what is actually submitted, and the Text within the will be what the user actually sees when making a selection. Remember that this will need to be inserted into your HTML document within the form fields.

Here is an example of the completed HTML contact form we have created with the dropdown box included:

HTML Contact Form with Dropdown Box

<form action="mail.php" method="POST">
<p>Name</p> <input type="text" name="name">
<p>Email</p> <input type="text" name="email">
<p>Phone</p> <input type="text" name="phone">
<p>Dropdown Box</p>
<select name="dropdown" size="1">
<option value="Option1">Option1</option>
<option value="Option2">Option2</option>
<option value="Option3">Option3</option>
<option value="Option4">Option4</option>
</select>
<br />
<p>Message</p><textarea name="message" rows="6" cols="25"></textarea><br />
<input type="submit" value="Send"><input type="reset" value="Clear">
</form>

Now we will need to change our contact form PHP to make sure the information from the HTML form is rendered and submitted to the provided email address.

Let’s take a look at our modified PHP that will now have the dropdown box readable.

<?php
$name = $_POST['name'];
$email = $_POST['email'];
$dropdown = $POST['dropdown'];
$message = $_POST['message'];
$formcontent="From: $name \n Message: $message";
$recipient = "[email protected]";
$subject = "Contact Form";
$mailheader = "From: $email \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
echo "Thank You!";
?>

Notice that we have added “dropdown” as a $_POST variable that will now be sent. The dropdown name itself comes from the HTML portion that is labeled as

The size option lets you select how many rows will be viewable at one time. The most general setting for this is “1” but you can change it to more if you would like.

Adding Radio Buttons and Checkboxes To a Contact Form

To add Radio Buttons and Checkboxes, the same will apply as the above. We will need to add it within our HTML code, and then modify the PHP to take the input from the contact form HTML and properly send it.

Here is an example of the HTML code for adding Checkboxes:

<p>Request Phone Call:</p>
Yes:<input type="checkbox" value="Yes" name="call"><br />
No:<input type="checkbox" value="No" name="call"><br />

Full Example Using All Elements In Contact Form

For this example I have changed some of the names to we can create a custom contact form for our completed example now that we have a basic understanding of the way it works.

Our HTML Contact Form Code

<form action="mail.php" method="POST">
<p>Name</p> <input type="text" name="name">
<p>Email</p> <input type="text" name="email">
<p>Phone</p> <input type="text" name="phone">

<p>Request Phone Call:</p>
Yes:<input type="checkbox" value="Yes" name="call"><br />
No:<input type="checkbox" value="No" name="call"><br />

<p>Website</p> <input type="text" name="website">

<p>Priority</p>
<select name="priority" size="1">
<option value="Low">Low</option>
<option value="Normal">Normal</option>
<option value="High">High</option>
<option value="Emergency">Emergency</option>
</select>
<br />

<p>Type</p>
<select name="type" size="1">
<option value="update">Website Update</option>
<option value="change">Information Change</option>
<option value="addition">Information Addition</option>
<option value="new">New Products</option>
</select>
<br />

<p>Message</p><textarea name="message" rows="6" cols="25"></textarea><br />
<input type="submit" value="Send"><input type="reset" value="Clear">
</form>

And again, our PHP that will correspond with this HTML form to make it work:

Our completed PHP Contact Form Code

<?php
$name = $_POST['name'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$call = $_POST['call'];
$website = $_POST['website'];
$priority = $_POST['priority'];
$type = $_POST['type'];
$message = $_POST['message'];
$formcontent=" From: $name \n Phone: $phone \n Call Back: $call \n Website: $website \n Priority: $priority \n Type: $type \n Message: $message";
$recipient = "[email protected]";
$subject = "Contact Form";
$mailheader = "From: $email \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
echo "Thank You!";
?>

Customizing the Thank you Message on Contact Form Success

Now for the final part of this tutorial, I will explain how to customize the very last line of our PHP script we have created. The basic way will just echo “Thank You” on our screen, but we need to make a better way so our viewers can easily have a way to get back to another page.

This will be useful in creating a custom page redirect, or a link to bring the user to a different area after completing the form. Remember that when working with PHP, some of the HTML will be different as to not disrupt our PHP code.

We will need to use single quotes “instead of double quotes” within this one, so we don’t end our PHP arg.

We will be adding a space after the “thank you” message, and adding a link back to our “form.html” document (Or whatever link you wish to create) – and also changing the color of the link using inline styles.

Let’s take a look at the modified echo command in our mail.php file:

echo "Thank You!" . " -" . "<a href='form.html' style='text-decoration:none;color:#ff0099;'> Return Home</a>";

You can play around with the example above to create your own thank you message for your site. Inline styles are not required; I just used them for this example instead of including a stylesheet. Remember that the echo command is only seen on a successful send of the message. Otherwise, the error message is sent.

Download The Contact Form Files

I am providing the download for the completed form for you to play with. Feel free to use it any way you wish, and customize it for your own projects. There are still many other things that can be done with PHP for your contact forms.

One that you might want to consider is CAPTCHA, which prevents spam email. You can also customize the other portions of the form and create your own! Have fun, and I hope that everyone has enjoyed the article and finds it useful for their own needs.

You can download the example files by clicking [HERE]

Note: I have included a few styling examples using CSS in the demo download. This will allow you to see the forms styled and understand how to style them using CSS.

Editorial Team

Written by Editorial Team

95 Comments

  1. Shows ‘ERROR’ not sending any mail!!!

    Reply

  2. i did not send the mail
    there is show (error!)

    Reply

  3. Hi, the code is perfect for me, the point is that i want to stay in the same page when the message is send. Is there something that I could do?

    Reply

  4. Halo, thanks for your sharing and I found your tutorial is helpful.
    I have did mail php to my web but i can’t received any email.
    So is my script have any problem?

    Reply

  5. Nice , I ‘m learning blog and look for a nice contact form , finally I found here ..
    thank you
    sorry if my english is bad , I’m Indonesian .

    Reply

  6. Your tutorial was really easy to follow.
    Thank you so much!

    I was wondering if it is possible to put an alert to notify the person who just sent the contact form while staying on the same page with the form being “clear” at the same time.

    Reply

  7. Seema Salaskar February 4, 2016 at 06:27

    Thanks a lot…… finally got a solution to my problem of getting contact us form data on my email from your simple explanation about php …. once again thanks a lot …..

    Reply

  8. The form doesnt work for me…it just jumps to the top of homepage on clicking send
    any suggestions?

    Reply

  9. Katie Colton May 14, 2012 at 19:01

    I am so glad you created this help file! You really helped me to resolve some issues I had on getting my form to work for my web design class! Thank you! Only one question I have is with checkboxes: When all 6 boxes are selected, I only get the last value, not all of them. I used $interested_in = $_POST[‘interested_in’];
    Is there some other consideration when multiple values can be selected? How do I make sure all values are successfully transmitted? Thanks.
    -Katie

    Reply

  10. Awesome tutorial, thanks!
    Also, if you want to redirect user who send email, simply put this code in mail.php just behind “$mailheader” line:

    header("Location: email-send.php");

    This will redirect user to page “email-send.php”, where you can put your “thank you page” ;)

    Reply

  11. Hello,
    To contact an advert owner, the users will have to fill a contact form which will be send to the owner email(hotmail,yahoo,…), but the php script is hardcoded so how i will be able to do it?is it possible to write a script which can be use for all the contact form without modifying it each time a user is contacting different Ads owner?please can anybody help me out!!!…

    Thank you.

    Reply

  12. Thank you for sharing this!!! It really helped me out. I did however run into a problem. My form has about 15 fields and 5 of them are drop down menus. Well after I loaded the files to my server all the drop downs went missing. If i hover over where they use to be and click the drop down menu re-appears. How would I make them reappear permanently? Thanks again!

    Eric

    Reply

  13. Thanks for posting this. It helped with a client’s site. You rock!

    Reply

  14. Hey, great tutorial. However, I have a problem: When I try to submit the form, instead of emailing me and providing the thank you message, it downloads the php page. When I run the .html page in my browser, it shows up fine but when I click send it downloads mail.php, instead of working.
    Any suggestions?

    Reply

  15. I can’t get the drop down menus to show correctly in the email body. The new line seems to be ignored and they just appear in one long line, any ideas?

    Reply

  16. This tutorial is very useful for me

    Reply

  17. Hi how would you change the script to include a copy of the form being sent to the person who filled in the form?????????

    Thanks

    Reply

  18. ALWAYS, I mean ALWAYS, literally *always* sanitize user input. If somebody decides to store this in any other way besides sending via e-mail (@ESTEBAN pointed out correctly, that wp_mail() is available), or echo out the thank you message with the $name in it, XSS will become an immensely huge problem. Validation and sanitization of user input should ALWAYS be touched upon when dealing with the topics of forms. Besides, WordPress has great functions such as is_email(), esc_attr(), get_the_content() even, that can be used to sanitize and provide a more secure environment, without rolling their own functions.

    Safe!

    Reply

  19. This is GREAT!!! THANK YOU THANK YOU!!!!!!!!!!!!!!!!

    Reply

  20. hey i want to know that where to upload my swf file ,php and logo for contact form active on my blog

    Reply

  21. I must be totally stupid I can’t figure this out.. is there anyone that does php scripting that can tell me what I’m doing wrong? Maybe my form is too darn complex.. imagine that LOL

    If anyone has any insight to help or if Kevin will email me that’d be friggin awesome!!

    Reply

  22. Why not use wp_mail() ?

    Reply

  23. This has been a great tutorial, but it seems that I am having trouble actually receiving emails for the form. Additionally the “Thank You” and page redirect are not working.

    Thanks for any help you can offer.

    Reply

  24. Hi excellent tutorial, however what if they have what multiple option selection for radio button or check box how do i read in all the values, give each radio box a unique name?, but what if not all radio buttons are checked.

    thanks man,

    Philio

    Reply

  25. Awesome work.
    Very lucid.

    Reply

  26. I get syntax errors for the $recipient portion. How do I make it error-free?

    Reply

  27. I have struggled with forms/php for a long time now. I used this and was up and running in minutes. Thank you SO much for your clear explanation.

    Reply

  28. Do we don’t need to add server/host name, ID and password??

    Reply

  29. Huge headache saver. I’ve been looking for a basic form tutorial like this for a while. Thanks so much, I appreciate it!

    Reply

  30. Thanks very much.
    A very interesting and informative read.
    I need to implement something like this on my website as well.

    Reply

  31. Hi there:
    Great tutorials. I am however, trying to figure out how to make the drop down menu allow for multiple selections. Can you please show any code on how to do that?
    Thanks again,
    Ronny

    Reply

  32. Great tutorial! It did take me longer than it should! Getting to grips with this stuff now.

    Reply

  33. Awesome tut! I just did this last week with the help of a co-worker with a lot more HTML and PHP experience than myself. He did exactly what you have here, but you have covered some things he didn’t. This will be a page I visit OFTEN for future work to include those extra items. Great work and thank you very much for your time.

    Reply

  34. For some reason, when I used this code on m website, the form doesn’t actually make it to my email. ive changed the email address in my mail.php. but it Wont work!. im not sure what to do right now.

    Reply

  35. is there any way to add referral url? I want to put it to my Interspire Shopping Cart 6 which does not have this feature.

    Reply

  36. Outstanding, easy to follow tutorial. Many, many thanks for your clear, concise help!

    Reply

  37. i keep gettin error when i upload the form on my website. y is that so? can anyone help me out pls..

    Reply

  38. Wow, this is a really good tutorial for noobs like me. It’s really well-explained and to the point, thank you so much! You’re a life-saver :)

    Reply

  39. Thanks for the great tutorial. Quick question: (I’m clearly missing something here!)
    I’m using multiple checkboxes in my html form as follows:

    SMS/text subscriptions
    Mobile websites
    Mobile applications
    Not sure, tell me my options

    These are intended to be a multi-checked scenario, and I’d like all values checked to return to me. Problem is that only one of the ckecked items returns. Any ideas on how to alter this to make sure I get all the data returned that is checked?

    Thanks in advance…

    Reply

    1. Rean John Uehara May 17, 2011 at 20:19

      Hi, are you using arrays?

      Reply

      1. No. I’m not sure how to write that, being a beginner… Here’s what I’m using: (formats being the name of the checkboxes)

        $formats = $_POST['formats'];
        $formcontent="formats: $formats \n"

        Reply

        1. Rean John Uehara May 18, 2011 at 18:56

          Try doing this on your form:
          input type=”checkbox” name=”formats[]” value=”1″/>
          input type=”checkbox” name=”formats[]” value=”2″/>
          [ and ] are important
          and so on..

          then in your php send the data by:

          for($i = 0; $i<count($_POST["formats"]); $i++)
          {
          echo $_POST["formats"][$i];
          }

          it should send and display multiple values selected on the form(display values to check).. at least I hope..haven’t had the chance to test this, just wrote it and it’s been a while since I touched PHP. Please tell me it works. lol

          Reply

          1. Thanks for your help!
            Unfortunately, all I’m seeing is the letter “m” and not the values in the array. My goal is for all the form data to return to me in an email, in case it wasn’t as clear before:)

            $formats = $_POST['formats'];//first set of checkboxes
            for($i = 0; $i<count($_POST["formats"]); $i++)
            {
            echo $_POST["formats"][$i];
            }

            $formcontent="formats: $formats n";
            $recipient ="[email protected]";
            mail($recipient, $formcontent);
            header('Location: thank_you.html');

            Reply

  40. THANK YOU!!! Well written, easy to follow, and best of all to the point. Thank you.

    Reply

  41. I keep getting a internal server error.. even when i upload unchanged form.htm and mail.php(exept recipient mail adress) can someone help me out please? just can get it to work. i want to use it on a iweb created website.

    Reply

  42. This was a really helpful tutorial. Thanks for the download as well!

    Reply

    1. vilas patil May 6, 2011 at 12:30

      thank you

      Reply

  43. I’ve found that they are line breaks so the output of the field become separated in the email received.

    Now I’ve another problem…. The form sends and I’m taken to a new page where it just ehoes thank you and provides a link to a page of my choosing. How do I get the form to send me to a page with the same template as my site?

    Anyone……..????

    Reply

    1. Simon Vincent April 20, 2011 at 20:12

      Hi, at the bottom of the mail.php i just added this

      // redirect away from post page.
      header(‘location: http://www.yoursite.com/signup-success/‘);

      obv replace my address with your own

      Reply

      1. Hi Simon,
        Where exactly did you put the redirect code:
        // redirect away from post page.
        header(‘location: http://www.roothost.co/signup-success/‘);

        Thanks,
        M

        Reply

  44. Nice tutorial, just what I needed. I found a form validation jquery code, but lacked a mail.php file. Every other tutorial assumes a level of knowledge I do not possess. . .

    One question….

    What are these bits in the mail.php code?

    rn

    Do I need these?

    Reply

  45. Sorry … Freudian slip … I meant GOOD validation :)

    Reply

  46. Any recommendations on god validation? The tutorial is great, but having all info in one place would be even better! thanks :)

    Reply

  47. we have a Local webserver on our interanet using windows2003 server.
    and also have a local domino mail server in our interanet. can i use this code to create a form on our local webserver and send forms via local mail server. what are the requirements and how to do it ?

    Reply

  48. How to make some fields mandatory ? Can any one give code to do this in the above example ?

    Reply

  49. Great Information. I needed this badly.

    Thank U Very Much

    Reply

  50. Kevin, great tutorial, and I apologize for all the disparaging comments made by other people. Why they are wasting their time complaining to you about validation and sanitation, I don’t know, if they know enough code to get through this tut then they should be able to tackle those issues by themselves. This isn’t an advanced tutorial (but there isn’t anything wrong with that), and there is a lack of good php form tutorials out there so I’m really thankful you had the patience to put this one together. I just wanted to say thanks a bunch, and keep of the great work!

    Reply

  51. You also want to add http://www.google.com/recaptcha a free captcha so that bots can’t just spam flood your email.

    Reply

  52. I tried this on my portfolio and when I press submit, I get a blank white page and no email. Do you know what could be the problem? I only have text fields, and I put the following in a separate document called mail.php:

    Is it because I’m testing it on a local folder and it needs to be on a server to work?

    Reply

    1. It definitely needs to be on a server. Or at least something with php installed. You could use WAMP on your windows machine to run php scripts.

      Reply

      1. Yeah, I thought that was it. Thanks!

        Reply

    2. Kevin Stanley October 2, 2010 at 04:32

      PHP needs to be ran online. Unless you are set up for it locally, it will only work when placed online.

      Reply

  53. Great tutorial for a newbie like me.

    Commenters highlight that validation, verification and sanitation is absolutely necessary – please could they post links to their tutorials/trusted tutorials detailing the steps?

    Reply

  54. Thanks for another really useful tutorial! Just one query – how do you make the input fields mandatory? I know this is possible but can’t find out how to do it.

    Reply

    1. There is a really good and very simple way using JavaScript to make fields mandatory. Search for it online and I am sure you will find it.

      Reply

    2. Javascript will be the “prettiest” way to make them required but people can disable javascript so you can just do a check in php like if(!$_POST[‘example’]) or if(!isset($_POST[‘example’]) and if either of these return true then do not finish the submission and return and error like “example is a required field” I suggest repopulating all of the boxes that they did fill in so they don’t have to.

      Reply

  55. Unsafe code, don’t use straight without input sanitation.

    Reply

    1. I have mentioned that already. This tutorial is to show the use of HTML forms and PHP. The code should not be used without some form of sanitation.

      Reply

  56. I find this article very useful for learning the basic techniques behind a php contact form (as mentioned before with the need to add certain features, like validation, spam-protection. etc.). What bothers me is the article’s title… today, everything is “kick-ass”, “awesome”, and “breath-taking”. Of course you get the people’s attention with such titles, but sorry, this is a really nice basic tutorial, but it’s not “kick-ass” :)…

    Reply

    1. Don’t hold me responsible for the title. It was posted that way, and I just wrote the tutorial :)

      Validation is a must, as well as spam protection. This tutorial was meant to show the use of HTML forms and PHP.

      Thanks for the comment!

      Reply

  57. cool yaar…very good looking form

    Reply

  58. Shouldn’t we have a verification if fields are empty or not and if $_POST[‘submit’] isset? I’m not a PHP developer, I’m just asking.

    Reply

    1. I would recommend you always validate any forms using javascript as a first line of defence, and then revalidate on the server. It is also wise to validate that the fields (especially email fields) don’t contain any nasty surprises.

      Whether you use a captcha or some other form of antispam is up to you, but I would also recommend this.

      Reply

  59. Hi – thanks for another excellent tutorial! One question – I know its possible to make input fields mandatory but can’t work out how to do so – can anyone help?

    Reply

  60. Kevin, when using a wordpress install do you prefer raw code forms or using a plugin like contact form 7?

    Reply

    1. Contact Form 7 is excellent!

      Reply

  61. Awesome tutorial.. Thanks :)

    Reply

  62. What not validation? If someone is using this turorial because they can’t code a form they are not going to know how to validate it with php….

    Reply

    1. There are so many different ways to validate. This tutorial is for showing how you can make html forms work with PHP to perform a funciton. Validation should always be done I agree, but the choice is up to the user creating the form. Having a good understanding of how the forms and code works will also better help someone trying to learn to code themselves, and how to implement a CAPTCHA if they choose.

      Reply

  63. Geoffrey Gordon September 27, 2010 at 15:13

    Great tutorial, how do you connect it to mysql database or is it unnecessary? Excuse my ignorance, I use jotforms, I code a lot in html and css, but learning php, so I want to make the transition and code my own forms.

    Reply

    1. No MySql needed. Just the HTML form and PHP. As from the other comments, you can see that you still need some form of validation. This will be super easy to add into the code before placing it on a live site.

      Reply

  64. Nice
    awesome Tutorial
    thanks

    Reply

  65. You forgot validation. Isn’t your code vulnerable to “email header injection”?

    Reply

  66. it is better to sanitize user inputs before sending emails, inserting into db etc..

    Reply

  67. Nice, clear explanation of how a php contact form works. Hardly kick-ass though, this would have to be seriously upgraded for production.

    Reply

    1. kolinio musuka March 21, 2016 at 10:02

      very good indeed ,ive been struggling with this tutorial..please can you help further my career on bulildin forms like this in the future?”..

      Reply

  68. I like the idea, but its very basic :D i missed the validation part, but great tut for html beginners! Keep on the good work!

    Reply

  69. I’ve never been able to actually make a good form. This tutorial is indeed priceless. Will surely bookmark and promote it myself too.

    Reply

  70. I think this is the best way to get your website in multiple black lists.
    Why? because this form is superb to spammers. It performs no data sanitization,
    And spammers can construct additional headers into message.
    This allows them to spam other people USING your webserver without you even knowing it.

    Reply

  71. Hi,
    It is imperative to sanitize all input data.

    It can be used to evil purposes just by changing the email input to a textarea and typing
    [email protected] \nBcc: [email protected], [email protected], [email protected], …, [email protected]

    Nice blue form tho.

    Reply

    1. Sanitizing the email field and validating the fields are filled was the first thought I had when I finished the email.

      I believe we are doing any designers or other person building a website a strong disservice when we include code that is said to do exactly what the user needs but includes absolutely no security.

      Reply

  72. What about “labels” before the “input” instead of “p” ?
    With of course “for” attributes relative to input’s “id” ?

    Whatever, thanks for the tutorial !

    Reply

  73. Love it! But can add in a hidden form and check the form for spam too?

    Reply

  74. I agree that there is much more before putting this as is on a live site. The purpose of this tutorial is to show how to get html forms to interact with PHP to perform functions and calls. With validating this form, and adding a captcha, it would be ready. I did add at the footnotes that more modification could be done, and wanted to use the tutorial to let people learn how to build the form itself, while learning to work with forms and PHP. Thank you for the feedback.

    Reply

Leave a Reply