PHP to send HTML contact form from site to Email

I’ve been combing forums for 2 weeks now trying to find a way to have a working contact form on my portfolio site. I couldn’t have fathomed how difficult this task is turning out to be. I’m a competent HTML and CSS developer. PHP, however, is new to me. I’ve been studying up on it at treehouse and understand the basic $_POST, *echo, and !isset commands.

I am currently trying to use the PHP from Chris Coyer’s contact form in my portfolio site live @

I’m so frustrated after trying many different solutions I just want it to work!!!

I’m fairly certain my HTML is solid but I’ll post that anyways. I’m pretty sure the problem is in the PHP that I have. I’m not married to this solution so if you know of a simpler way to send 3 bits of info (name, email, and message) from a contact form on site to my email inbox I’d love to hear it.

Any help is greatly appreciated


                               <div class="contact_form">
                           <div class="touch">&nbsp;</div>   
                           <form id="contact_me_form" method="post" action="email.php">
                              <div class="error_contact" id="name_error">Name is Required</div>
                              <input type="text" placeholder="Your Name (required)" id="name" class="textbox" />
                              <input type="text" name="email" id="email" placeholder="Your Email (required)" class="textbox email">
                              <div class="error_contact" id="comment_error">Message is Required</div>                         
                              <textarea cols="25" rows="5" name="message" id="comment" class="textbox message" placeholder="Your Message ( Inquiry? , Freelance Work? , or Just to Say Hi...)"></textarea>
                              <input type="image" src="img/send.png" alt="Send Message" name="submit" class="button submit_btn">

Form PHP


$EmailFrom = "";
$EmailTo = "";
$Subject = "Nice & Simple Contact Form by CSS-Tricks";
$Name = Trim(stripslashes($_POST['Name'])); 
$Email = Trim(stripslashes($_POST['Email'])); 
$Message = Trim(stripslashes($_POST['Message'])); 

// validation
if (!$validationOK) {
  print "<meta http-equiv=\\"refresh\\" content=\\"0;URL=error.htm\\">";

// prepare email body text
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\
$Body .= "Email: ";
$Body .= $Email;
$Body .= "\
$Body .= "Message: ";
$Body .= $Message;
$Body .= "\

// send email 
$success = mail($EmailTo, $Subject, $Body, "From: <$EmailFrom>");

// redirect to success page 
if ($success){
  print "<meta http-equiv=\\"refresh\\" content=\\"0;URL=contactthanks.php\\">";
  print "<meta http-equiv=\\"refresh\\" content=\\"0;URL=error.htm\\">";

Thanks for reading.

You have a couple of issues in your code, the first of which is your missing the name attribute on your name input.

<input type="text" placeholder="Your Name (required)" id="name" class="textbox" [COLOR="#FF0000"][B]name="name"[/B][/COLOR] />

The second of which is your $_POST key names don’t match your form names, they are case sensitive so they need to match.

$Name = Trim(stripslashes($_POST['[COLOR="#FF0000"][B]n[/B][/COLOR]ame'])); 
$Email = Trim(stripslashes($_POST['[COLOR="#FF0000"][B]e[/B][/COLOR]mail'])); 
$Message = Trim(stripslashes($_POST['[COLOR="#FF0000"][B]m[/B][/COLOR]essage']));

Also it’s extremely bad practice to name your form inputs with a value of name, the value should be meaningful. For instance name could instead be fullname.

Hi kalmykov. Welcome to the forums. :slight_smile:

Yes, those errors Chris pointed out are important. It’s also a shame the form has no labels, which is good for accessibility, even if you hide them. The form also includes little or security, which is worth including too. I have a form on my site that people have found handy, so feel free to check that out (link in my signature). It includes security and a honeypot to ward off spam bots.

Thank you both for the warm welcome and tips. As i said PHP is very new to me, so adding security to it is WAY over my head.
My biggest concern is getting it to actually send the data inputed to my email. I fixed the capitalization issue and added the name attribute on my name input but unfortunately it’s still not sending. However, that was somehow interfering w/ my java script which is now working so now at least SOMETHING happens when you click submit :rofl: I didn’t think the two (PHP and Javascript) would get in eachothers way but apparently they do so I’m posting the relevant Java script as well.

$(function() {

  $(".submit_btn").click(function() {
		// validate and process form
		// first hide any error messages
	  var name = $("input#name").val();
		if (name == "") {
	  $("input#name").css({border:"1px solid #B9B925"});
      return false;
		var hasError = false;
        var emailReg = /^([\\w-\\.]+@([\\w-]+\\.)+[\\w-]{2,4})?$/;

        var email = $("input#email").val();
        if(email == '') {
            $("input#email").css({border:"1px solid #B9B925"}).before('<div class="error_contact" id="email_error">Please enter your email address</div>');
            hasError = true;

        else if(!emailReg.test(email)) {
            $("input#email").css({border:"1px solid #B9B925"}).before('<div class="error_contact" id="email_error">Enter a valid email address</div>');
            hasError = true;

        if(hasError == true) { return false; }
		var comment = $("textarea#comment").val();
		if (comment == "") {
	  $("textarea#comment").css({border:"1px solid #B9B925"});
      return false;
		var dataString = '&name=' + name + '&email=' + email + '&comment=' + comment;
		//alert (dataString);return false;
      type: "POST",
      url: "bin/process.php",
      data: dataString,
      success: function() {
        var m = $("#message");		
		$("input#name").css({border:"1px solid #B5B5B5"});
		 $("input#email").css({border:"1px solid #B5B5B5"});
		$("textarea#comment").css({border:"1px solid #B5B5B5"});
			"top": "-73px",
			"opacity": "1"				
		setTimeout(function () {
			"top": "-105px",
			"opacity": "0"
        }, 8000);	

    return false;

Ralph I checked out the Form on your site as well as the _setup.html and a great deal of it confuses me. I’m afraid that if I dropped this PHP for yours that I would screw things up even more then they already are. I understand (or at least think I understand :scratch:) every line in the PHP I’m currently using. Perhaps there is something in my Javascript keeping email.php from running.

I created a gist for this

I took a quick look and you have a double equals on your input attribute.

<input type="text" placeholder="Your Name (required)" id="name" name[B][COLOR=#ff0000]==[/COLOR][/B]"name" class="textbox" />

Thnx I fixed it on my site but still no dice :frowning:

You have renamed your input field to user but your JavaScript still references name