Secure PHP Contact Form

I’ve written up an easy to use, secure, accessible and XHTML Strict compliant contact form, originally for someone to use on their site, but figured I’d post it up here as a bit of a PHP tutorial for anyone who wants to understand what’s going on, or for others to just download, follow the instructions and use. I’ll explain its usage today and then dissect the form for any PHP learners later in the week.

First off, download the contact form, unzip it and open it in your favourite coding editor. The best version of this form requires PHP 4.4+ however I’ve altered the line that depends on this version so that you can use it down to version 4.0 however foreign characters will not be checked in the name. Both are contained in the download file.

This won’t work straight out of the box. You’ll need to edit a few lines first plus add in your surrounding HTML markup.

Edit the Basics

To get this up and running with minimal effort you need to do the following (from top down in the file).

  1. Edit the $to_email variable to contain your email address. So replace ‘you@yourdomain.com’ with your own email address, ensuring the double quotes are still kept around the email address.
  2. Edit the $redirect variable to contain the address, relative to the root, of your thank you page. So if your thank you page is found at http://www.yourdomain.com/contact/thankyou.html this value will become “contact/thankyou.html”.
  3. Edit the $subject variable to contain the text you want to appear in your email subject when you receive an email from the form.
  4. Locate the line >!– Your Header HTML code or include goes here –< and replace it with your standard site header markup. This could be a PHP include to include the header file, or plain HTML markup.
  5. Locate the line >!– Your footer HTML code or include goes here –< and replace it with your standard site footer markup. Again, this can be a PHP include or the plain HTML markup.

This should then leave you with a file that has the following sections:

  • PHP Script
  • HTML Header markup
  • Form in the content area
  • HTML Footer markup

At this point you should be able to upload this file to any PHP enabled server, view the file, complete the form and submit it. An email should then come through to your specified email account.

Advanced Options

There’s two advanced options in this form. The first is to add additional fields into the form, and they’ll still be picked up in the email. To do this, edit the form to include your additional form fields (checkboxes and file uploads are not supported in this form) using the following method (if you’re not sure on working with forms, read up on accessible form layouts):

Form Code Excerpt
  1. <div>
  2. <label for="cftext">Title: </label>
  3. <input type="text" name="cftext" id="cftext" size="30" value="<?php get_value('cftext') ?>" />
  4. </div>

Where text makes up your input’s fieldname. I would recommend keeping ‘cf’ at the start of all of your fieldnames as this means there is less potential for variables to clash in the PHP and it can help to reduce spam as spammers will often assume your field names are the general ones of ‘name’, ’email’, message’ etc. Title is then the value displayed on the page, so the form label.

The second advanced option is to also control your required fields. Near the top of the script there is a line:

PHP Code Excerpt
  1. // Specify the required fields
  2. $req_fields = array("cfname", "cfemail", "cfmessage");

This array lists the fields that are required to contain content. So if you added 3 extra fields, eg. cfurl, cftelephone and cfaddress and you want to make the telephone and address field required, but not the url field, then you can add these in by adding them to the end of the comma delimited list i.e.

PHP Code Excerpt
  1. $req_fields = array("cfname", "cfemail", "cfmessage", "cftelephone", "cfaddress");

This will then check that both the telephone and address fields have content in them, however the URL field can be left blank. Of course it will be wise to add

HTML Code Excerpt
  1. <em>Required</em>

After the label title and before the closing label tag, as I’ve done with the other required fields.

Guarantees

There are none! The form is secure to the best of my abilities. It checks against email header injection, it removes all html tags that may have been entered into the form, it checks the name entered contains just typical characters that a name would contain (including foreign characters)*, it checks your required fields contain content and it will email all details plus the user’s given IP address and browser details through to your specified email address. By using less than general field names, spam should be reduced to human spam (I use this method elsewhere and rarely get any spam off my forms that’s not human generated).

The form is accessible in that when you click a label title the cursor will be placed in the input box or textarea. It uses the correct markup of a fieldset and legends, and if you choose to extend the form I recommend you continue with these standards. Suggested CSS for the styling of a form and error warning is below.

Suggested CSS Code
  1. ul.warning {
  2. color: #c00;
  3. font-weight: bold;
  4. }
  5.  
  6. fieldset {
  7. width: 500px;
  8. border:none;
  9. border-top: 1px solid #999;
  10. padding: 10px;
  11. margin-top: 10px;
  12. }
  13.  
  14. legend {
  15. font-weight: bold;
  16. padding: 0 5px;
  17. }
  18.  
  19. label {
  20. width: 125px;
  21. float: left;
  22. text-align: right;
  23. margin-right: 5px;
  24. }
  25.  
  26. form div {
  27. clear: both;
  28. margin-bottom: 10px;
  29. }

So give it a go and let me know what you think. Any problems or comments, post them below and I’ll do my best to help out or accommodate you 🙂

* Only in the PHP 4.4+ version.

You may also like...

72 Responses

  1. Ben says:

    Hi Sarah,

    Apologies if there is a really simple solution to this – I’m a bit of a PHP dufus.

    Is it possible to avoid the ‘return to top of page’ behaviour when incorrect details are entered into the form?

    I have a contact form that is quite a long way down a page and it would be preferable if the warning message was immediately visible when the user presses ‘submit’.

    Thanks in advance and keep up the good work…

    Ben 🙂

    • Sarah says:

      Hi Ben, you could use an anchor link instead to jump back to the form. So where the error message is to be displayed, add an id to the ul tag, and then change the form action to include #id-name on the end of it, where id-name is the name of the ID. Hope that makes sense 🙂

  2. rsmbyrd says:

    Hi Sarah, I’ve used this form for a long time…;-) How do I make the redirect open in the same window without opening in a new one? Thanks!

    • Sarah says:

      Hi there. It’s been a while since I looked at the code (needs a few tweaks/updates!). There should be no reason why the redirect is opening in a new window as far as I can tell. Make sure you don’t have a target attribute in your form tag, as that could cause the browser to open a new window to submit the results to. Otherwise it should all stay within the same window/tab. If your form is online and you want to let me know the link feel free and I can take a look when I get a chance 🙂

Leave a Reply

%d bloggers like this: