How do I create customized web mail forms with extra data fields?

Tutorial

MemberGate allows you to create custom web mail / contact forms and add then to any page on your site.

When building your own form there are some key stages to follow.

The Thank You Page

You MUST create a "Thank you" page, this is where your user will be taken after they submit the form. A thankyou page is any content page which MUST include the following line of code somewhere in the page.

<cfinclude template="programs/mailform.cfm">

When you create the thank you page, note the full URL address - you'll need it in the next step.

The (Custom) Form

You will then need to create the form itself. Since the form involves using HTML, you probably will want to do this in an HTML editor until you get the look you want. The form MUSTcontain the following elements:

A Post Action.

<FORM METHOD="POST" ACTION="http://www.anypage.com">

The form action must be exactly like this line, replace the action page address with the full URL address the form should post to - this will be the address of the thankyou page you created above.

A Subject field. (Optional)

<input type="hidden" name="subject" value="Enter Your Subject Here">

This will be the subject of the email sent with form contents

A Send to field.

<input type="hidden" name="sendto" value="[email protected]">

This is the email address the form will be sent to - it must be an email address registered to your site.

A From Field. (use one option)

This is the email address of the person submitting the form.

Option 1 -

<input type="text" name="from" size="40">

Use either option 1 to show a standard input field which is used to for the persons email. It would look similar to this.

Name:

Option 2 -

<input type="hidden" name="from" size="40" value="[email protected]">

This uses the "hidden" type element which hides the input field from the user but you set the "from" address using the value. Users would not see this field in the form and it can be added immediately after the 'Send to field'.

In addition the above, you'll want the normal html code used to create form elements. You can include as many form input fields as you like - the only restriction is these form field names can not start with a number.

Example Form

Example Form
Name:
State:
Email:
Years of training to date for your sport:

Code for above form

<p align=center>
<table border=1 cellpadding=5 cellspacing=0>
<tr>
<td colspan=2 style="background-color:#AAAAAA;font-weight:bold"><p align=center>Example Form</p>
</td>
</tr>
<form action='//www.membergate.com/public/New_in_MemberGate_7.cfm' method='POST'>
<input type="hidden" name="sendto" value="@emailaddress.com">
<tr><td align=right><font color="#000000">Name:</td>
<td><input type=text name="name" size=20 maxlength=50 value=""></td></tr>
<tr>
<td align=right><font color="#000000">State:</td>
<td><input type=text name="state_of_residence" size=20 maxlength=50 value=""></td></tr>
<tr><td align=right><font color="#000000">Email:</td>
<td><input type=text name="from" size=20 maxlength=50 value=""></td></tr>
<tr><td valign=top align=right>Years of training to date for your sport:</td>
<td><textarea name=training cols=30 rows=5>       </textarea>     </td></tr>
<tr><td> </td><td><input type=submit value="Submit >"></td></tr>
</form>
</table>
</p>

Required Fields

Required feilds can be set using

<CFFORM> </CFFORM>

see this tutorial for examples.