Adding a mail form to your site

What are mail forms?

A mail form is a web page that contains various user defined response objects. This allows anybody viewing your pages to comment (via email to you) on subjects you define straight from your web page.

How do I start?

Creating a mail form is quite simple, the example below demonstrates the entries required in your html page.

<FORM Method="POST" Action="http://www.proweb.co.uk/cgi-bin/mailform.cgi">
<INPUT Type="hidden" Name="receiver" Value="yourname@proweb.co.uk">
<INPUT Type="hidden" Name="subject" Value="Mail from my mail form">

Your email address: <INPUT Type="text" Name="sender" Size="25"><BR>
(Note - further definable boxes to be place here)
<INPUT Type="submit" Value="Send this survey">
<INPUT Type="reset" Value="Cancel this survey">
</FORM>

This example will display a text entry box for the viewer to enter their email address in, eg:

Clicking 'Send this Servey' will post an email to yourname@proweb.co.uk (you must change 'yourname@proweb.co.uk' to your email address) containing the following information :

From www Thu May 9 13:46:21 1996
Date: Thu, 9 May 1996 13:46:21 +0100 (BST)
From: fred@bloggs.co.uk
Subject: Mail from my mail form
sender = fred@bloggs.co.uk

You should ensure that the 'Senders Email' box is referred to as Name="sender" in the INPUT line in order for the form to work correctly.

Text boxes

A text box will accept unformatted alphanumeric entries. Its size and maximum input length are both configurable.

How old are you: <INPUT Type="text" Name="age" Size="3" Maxlength="3">

Which would be entered between the 'Your email address:' and <INPUT Typ="submit"...lines and produce a result like :

The reply would look like this :

sender = fred@bloggs.co.uk
age = 27

You will notice the 'Name' keyword identifies the field contents, this keyword can be anything you choose, although you must use the defined Name for functions such as 'hidden', 'submit' & 'cancel'. Also note the use of the 'Size' keyword to set the size of the input area and 'Maxlength' to limit the number of characters that can be entered. If 'Maxlength' is greater than 'Size', the text will scroll to the left during entry when the box 'Size' is reached.

Drop down boxes

A drop down box is a text box with an attached, pre-defined list. The user can only select one of the entries in the list. Note the use of the 'Selected' keyword which initially selects an entry.

What is your favorite Web browser
<SELECT Name="Favorite Web Browser">
<OPTION value="Internet Explorer" Selected>Internet Explorer</option>
<OPTION value="Netscape">Netscape</option>
<OPTION value="Opera">Opera</option>
<OPTION value="Mozilla">Mozilla</option>
<OPTION value="None of the above">None of the above</option>
</SELECT>
<BR>

Mail message returned :

sender = fred@bloggs.co.uk
age = 27
Favorite+Web+Browser = Netscape

Adding the 'Size' keyword will cause the input box to become a scroll box. eg.

<SELECT Name="Favorite Web Browser" Size="4">

The number of lines in the scroll box will be Size minus one.
A scroll box can have multiple selections by using the 'Multiple' keyword. eg.

<SELECT Name="Favorite Web Browser" Size="4" Multiple>

This allows the viewer to select more than one item in the list.

Memo Fields
Can be used for general unformatted comments.

<textarea name="Comments" rows="3" cols="30">
</textarea>

Radio Buttons
Radio buttons offer the view a choice of selections using mouse control and can only select on option from a group. The buttons are grouped by the 'Name' keyword, allowing more than one group of radio button to be used for different subjects.

Please indicate your message subject:
Sales <input type="radio" checked name="subject" value="sales">
Support <input type="radio" name="subject" value="support">
Suggestion <input type="radio" name="subject" value="suggestion">

Check Boxes
Check boxes are simular to Radio buttons, but any number of options can be selected. The boxes are grouped by the 'Name' keyword, allowing more than one group of check boxes to be used for different subjects.

Which fruits do you like:
Apples <input type="checkbox" name="subject" value="apples">
Oranges <input type="checkbox" name="subject" value="oranges">
Bananas <input type="checkbox" name="subject" value="bananas">

Additional Controls
When the mailform is posted, the mailform script will generate a ghost html page informing the viewer that the mail message has been sent. You can add several parameters to make this page match the style of your site. These parameters are optional.

Add a title to your page.

<INPUT type="hidden" name="title" value="Request Result">

Add an appropriate thank you message.

<INPUT type="hidden" name="message" value="Thank you for your feedback.">

Add a return to page xxxx.html clickable url.
'returnurl' is the full url of the page to return to.
'returntext' is the text to print eg. Back to my homepage
Note : must be used as a pair

<INPUT type="hidden" name="returnurl" value="http://www.proweb.co.uk/~login/index.html">
<INPUT type="hidden" name="returntext" value="Back to Link (or whatever you want)">

Add a background image to the ghost page, again a full url is required.

<INPUT type="hidden" name="background" value="http://www.proweb.co.uk/~login/back.gif">

Set the background, text, link and vlink colours.
These must be supplied as hex, red green blue values and can be used individually.
Example would give black background, white text, green link & blue used link.

<INPUT type="hidden" name="bgcolor" value="#000000">
<INPUT type="hidden" name="text" value="#000000">
<INPUT type="hidden" name="link" value="#00FF00">
<INPUT type="hidden" name="vlink" value="#0000FF">

Add a forward to page xxxx.html.
'fwdurl' is the full url of the page to return to.

<INPUT type="hidden" name="fwdurl" value="http://www.domainname.com/pagename.html">

on submitting the form you will be forwarded to the page you have selected.

TIP: F9 in outlook performs a send and receive