User Tools

Site Tools


more_secure_contact_forms

Work-in-Progress

This page of documentation is a work-in-progress. If you're reading this message, please do not attempt to implement the procedures below. When these procedures are finalized and ready for implementation, we will remove this warning.

Thank you for your patience.

A More Secure Contact Form

Contact forms in CE3 plugins utilize the free version Form-to-Email PHP script from http://formtoemail.com. It's a highly secure script that prevents spambots from harvesting your email address from your webpages. Spambots can still succeed in submitting the form, though, and may hammer the page hard once they find it. In my experience, spam barrages will pass within a matter of days. Attacks may then resume at a later date, but I have found that it is not typically a day-to-day problem.

Regardless, you may wish to bolster your contact form security to help reduce or eliminate instances of spam bombardment. With PHPlugins, it's relatively simple to beef up security. Before we begin, you will need to do two things:

Creating the initial function

To manipulate the contact form, we're going to use the ttg_contactform hook, available in TTG CE3 Client Response Gallery and TTG CE3 Pages 6.0.1 and later. So our starting function looks like this:

function ttg_contactform( $style, $path ) {
echo '
	<!-- user content here -->
';
	return false;
}

From this point, we should fill in the source code for our existing contact form. Open a page containing your contact form, for example the contact.php file online from your TTG CE3 Pages creation, or the index.php file of a TTG CE3 Client Response Gallery export.

Search the page for “fieldset”. Between the <fieldset> and </fieldset> tags, you will see the PHP code that defines the ttg_contactform hook, and then you will see several items like this one:

	<p>
	<label for="field1">Name</label>
	<input id="field1" name="name" type="text" size="30" tabindex="1" required />
	</p>

The first will be “Name” and the last will be “Message”, or whatever you've assigned as labels during Lightroom setup. Copy all of this and put it into your function:

function ttg_contactform( $style, $path ) {
echo '

	<p>
	<label for="field1">Name</label>
	<input id="field1" name="name" type="text" size="30" tabindex="1" required />
	</p>

	<p>
	<label for="field2">Email</label>
	<input id="field2" name="email" type="text" size="30" tabindex="2" required />
	</p>

	<p>
	<label for="field4">Website (optional)</label>
	<input id="field4" name="Website (optional)" type="text" size="30" tabindex="3" />
	</p>

	<p>
	<label for="message">Message</label>
	<textarea id="message" name="message" rows="7" cols="30" tabindex="4"></textarea>
	</p>

';
	return false;
}

Enable 'Pre-populate' and 'Display Errors' features

If enabled, a session will be created and the submitted values from the form will be stored in the session. This means the values will be available to your form page should your visitor go back to your form after getting an error. You can then display (pre-populate) the submitted values on the form. To display the values, you need to add some code to your form page (the script can't do that for you) and enable the relevant options in the Form-to-Email Pro PHP script. This prevents the visitor getting a blank form when they return to the form to correct any errors. Such blank forms are caused by browser behaviour and settings (not the script). Some browsers refresh the page when you hit “back” others don't. If the form page is refreshed, the visitor gets a blank form and has to enter their information over again. Enabling the option below and coding your form page to display the submitted values means your visitor won't be faced with a blank form if they have to return to it, they will get the values they submitted.

To accomplish this, we need to setup a second PHPlugins function using the ttg_user_load hook. This function we only want to run on pages containing contact forms, so we're going to use G_STYLE conditions to target such pages specifically. Here's our starter function:

function ttg_user_load( $style, $path ) {
	if (G_STYLE == 'CE3-PAGES-CONTACT' || G_STYLE == 'CE3-CRG') {

// Our custom PHP will go here

	}
} // END

Create an email verification field

First, let's create an email verification field. This is a secondary field where the visitor must re-enter their email address. The address entered must match the address in the first email field or the form will not send. So we'll hone in on this part of the form:

	<p>
	<label for="field2">Email</label>
	<input id="field2" name="email" type="text" size="30" tabindex="2" required />
	</p>

Duplicate the above, and make the following changes to the new instance:

  • Change label to “Confirm Email” (or whatever you want).
  • Change the values <label for="field2" and <input id="field2" to a unique identifier not being used elsewhere in the form. For example, change both instances of “field2” to “field2confirm”.
  • Change the input element's name attribute to “email2”. This is important! It must be named “email2”.
  • Update the form's tabindex attributes to maintain sequentiality.

So we now have this:

	<p>
	<label for="field2">Email</label>
	<input id="field2" name="email" type="text" size="30" tabindex="2" required />
	</p>

	<p>
	<label for="field2confirm">Confirm Email</label>
	<input id="field2confirm" name="email2" type="text" size="30" tabindex="3" required />
	</p>

Next, you will need to edit the Form-to-Email Pro PHP script. Find this:

$confirm_email_address = 0;

Change to this:

$confirm_email_address = 1;

Save your changes to both files. Your complete function in phplugins.php should now resemble this:

function ttg_contactform( $style, $path ) {
echo '

	<p>
	<label for="field1">Name</label>
	<input id="field1" name="name" type="text" size="30" tabindex="1" required />
	</p>

	<p>
	<label for="field2">Email</label>
	<input id="field2" name="email" type="text" size="30" tabindex="2" required />
	</p>

	<p>
	<label for="field2confirm">Confirm Email</label>
	<input id="field2confirm" name="email2" type="text" size="30" tabindex="3" required />
	</p>

	<p>
	<label for="field4">Website (optional)</label>
	<input id="field4" name="Website (optional)" type="text" size="30" tabindex="4" />
	</p>

	<p>
	<label for="message">Message</label>
	<textarea id="message" name="message" rows="7" cols="30" tabindex="5"></textarea>
	</p>

';
	return false;
}
more_secure_contact_forms.txt · Last modified: 2013/04/08 08:32 by admin