BlogHarbor has implemented NMS FormMail, a script which converts an HTML form submission to an email message. You can add HTML to your blog article which allows you to receive the results of a form submission via an email message.

The Web Pages feature of our service is a useful way to implement your forms.

In order to implement forms on your BlogHarbor weblog, knowledge and understanding of HTML in general and forms in particular is required.

Security

In order to use this script on your weblog, you will need to know the "Blog ID" of your BlogHarbor weblog. If you do not know your BlogHarbor Blog ID Number, please access the Account Preferences control panel to retrieve your Blog ID Number.

Using your Blog ID in place of your email address in the HTML form will protect your email address from being harvested by spammers. Our script will convert your Blog ID Number to the Administrator's email address of your weblog, and send the email to your Administrator's email address. This protects your privacy, keeping your personal email address off of the web page itself. This script will only send email to the Administrator so please make sure that your Administrator email is current before you begin creating your forms.

Additionally, only weblogs hosted by BlogHarbor are permitted to use this script. If you are attempting to use this script on another website or testing it on your local disks, it will not work.

Creating the HTML

At its simplest, the HTML for creating an email form looks like this:

<form method="post" action="http://tools.blogharbor.com/cgi-bin/FormMail.pl">
<input type="hidden" name="recipient" value="1000" />
<input type="hidden" name="subject" value="Feedback Form Example 1" />
<input type="hidden" name="required" value="email,realname,feedback" />
Please enter your Email Address: <input type="text" name="email" /><br />
Please enter your Full Name: <input type="text" name="realname" /><br />
Please enter your Comments: <input type="text" name="feedback" /><br />
<input type="submit" value="Submit Form" />
</form>

The HTML code above creates form which looks like this:

In this example, the form will send email to the Administrator of Blog ID 1000 and the subject of the email received by the Administrator will be Feedback Form Example 1. The subject of the email is customizable. The form uses 3 input fields:

• email - This is the Email Address of the person who fills out your form; it will be used as the From address in the email message sent to the Administrator.
• realname - The name of the user filling in the form is also being requested, and will also be shown in the From address in the email message sent to the Administrator.
• feedback - This is a custom field, you can create as many custom fields as you need.

Finally, the line <input type="hidden" name="required" value="email,realname,feedback" /> sets all 3 fields (email, realname, and feedback) as required: if they are not filled in the form will generate an error message.

Customizing Your Form

By using additional hidden fields you can customize the behavior of the form. The chart below shows some of the addition hidden fields you can use to modify the look of the success page and the information contained in the email sent to you upon completion of the form.

More examples

In this example, we will use a table to format the form:

Here is the code we used to create the table above:

<form method="post" action="http://tools.blogharbor.com/cgi-bin/FormMail.pl">
<input type="hidden" name="recipient" value="1000" />
<input type="hidden" name="subject" value="Feedback Form Example 2" />
<input type="hidden" name="required" value="email,realname,feedback" />
<table border>
<tr>
<td>Email Address:</td>
<td><input type="text" name="email" /></td>
</tr>
<tr>
<td>Full Name:</td>
<td><input type="text" name="realname" /></td>
</tr>
<tr>
<td>Comments:</td>
<td><textarea name="feedback" rows="3" cols="50"></textarea></td>
</tr>
<tr>
<td colspan=2 align="center"><input type="submit" /></td>
</tr>
</table>
</form>

Here is another example, in which we add a link back to the BlogHarbor home page upon successful submission of the form, customize the success page's background color, and add a few more custom fields:

Here's the HTML code for the form above:

<form method="post" action="http://tools.blogharbor.com/cgi-bin/FormMail.pl">
<input type="hidden" name="recipient" value="1000" />
<input type="hidden" name="subject" value="Feedback Form Example 3" />
<input type="hidden" name="required" value="email,realname,feedback" />
<input type="hidden" name="return_link_url" value="http://www.blogharbor.com" />
<input type="hidden" name="return_link_title" value="Back to BlogHarbor Home Page" />
<input type="hidden" name="bgcolor" value="#ffffe7" />
<table border>
<tr>
<td>Email Address: </td>
<td><input type="text" name="email" /></td>
</tr>
<tr>
<td>Full Name: </td>
<td><input type="text" name="realname" /></td>
</tr>
<tr>
<td>Favorite Ice Cream: </td>
<td><select name="ice_cream">
<option value="Vanilla">Vanilla</option>
<option value="Chocolate">Chocolate</option>
<option value="Pistachio">Pistachio</option>
<option value="Chocolate Chip Mint">Chocolate Chip Mint</option>
</select></td>
</tr>
<tr>
<td>Favorite Barbecue Food: </td>
<td>
<input type="radio" name="barbecue" value="Hot Dog" checked/>Hot Dog
<input type="radio" name="barbecue" value="Hamburger" />Hamburger
<input type="radio" name="barbecue" value="Chicken" />Chicken
<input type="radio" name="barbecue" value="Potato Salad" />Potato Salad
</td>
</tr>
<tr>
<td>Comments: </td>
<td><textarea name="feedback" rows="3" cols="50"></textarea></td>
</tr>
<tr>
<td colspan=2 align="center"><input type="submit" /></td>
</tr>
</table>
</form>

Credit

This feature uses the NMS FormMail program, a secure rewrite of the original FormMail from Matt Wright.

Feedback

Questions or feedback about using the Form to Mail script? Post your comments below.