Web Forms can be created on either Bethel's Internet web or the bethelnet. The process is almost identical, but one setting is different. In general there are three components needed to develop a functional web form.

1. The Web form which can be created in Dreamweaver, Frontpage, another web authoring program or if you are a purist, html.
2. The configuration file (.fmc), which is a text only file that feeds information to a cgi "program" called FormMail.
3. The (optional) Results file (.results) which is simply a web page that you create (or use a pre-existing template) that tells the user what they have submitted.

How to Create a Simple Web Form (Using Dreamweaver)

Here is how to create a simple form that will collect a persons name, and their e-mail address.

Step 1: Insert a form field into your web page. Do this by either activating the Forms palette in the Tools Palette and clicking the Form Tool or going to the Insert Menu and selecting Form. What should appear is a red bounded box which is your form area. Put all your form components inside this form area.

Step 2: Insert the form components from the Forms palette or the Insert/Form Objects menu choices. For this tutorial I chose:

• The name and e-mail address use a Text Field

Step 3. Link your form and your configuration file by using the POST method and the ACTION

• Internet (if you publish to Beta, www1.bethel.edu):
  http://www.bethel.edu/cgi-bin/fm/FormMail2a.pl
  the html would look like this:
  <form name="form1" method="post" action="http://www.bethel.edu/cgi-bin/fm/FormMail2a.pl">
• bethelnet and Internet (www2.bethel.edu):
  http://www.bethel.edu/cgi-bin/fm/FormMail2.pl
  the html would look like this:
  <form name="form1" method="post" action="http://www.bethel.edu/cgi-bin/fm/FormMail2.pl">

Step 4: Save your form (I called this one forms-dw-simple.html)

The Form

How to Create a Configuration File

The configuration file is a text only file with configuration commands (See the Form Mail - How To document for all possible commands that you can use) that tell form mail how to process your form. For this form I created a NEW document in Dreamweaver, switched to code view and deleted all the html code. This first example shows you the bare minimum configuration needed to setup your form to use FormMail. There are two scenarios on how you would want to use FormMail:

1. Send an e-mail to some recipients
2. Send an e-mail to the submitter of the form (i.e. a confirmation e-mail), and to some recipients that want the information that was submitted

Configuration example #1: sending an e-mail to recipients only (Shown in a table for clarity only)

Configuration Example #2: sending e-mails to the form submitter and the recipients

[# in front of any configuration parameter disables that parameter]

The simple configuration file above for the simple form on this page will:

• send r-kistler@bethel.edu and webmaster@bethel.edu your name and e-mail address (recipients=)
• allows any form located on a bethel server use the associated configuration file. (referer=)

For Configuration 2:

• send r-kistler@bethel.edu and webmaster@bethel.edu your name and e-mail address (recipients=)
• Turn the abuse limiter on so that spammers cannot use your form to send emails. You must have this setting (abuselimiter=on) if your from is on the Internet and sends confirmation e-mails. For Internet forms you can set this feature to off (abuselimiter=off) for testing your form.
• send an e-mail confirmation (confirmemail=1) to the user with the subject of "A simple FormMail form example" (subject=); the header "You have submitted the following in the simple FormMail form example. " (confirmheader=) and a footer of "Now that you have tested this form and want to make your own, if you have any questions, contact Bob Kistler or Andy Altepeter" (confirmfooter=)

Finally, save your configuration file with the name of the form file and add a .fmc (which stands for FormMail Configuration) to the end of the name (e.g. forms-dw-simple.html.fmc). The configuration file should be saved into a folder called data which can be placed into the same folder as your form (or at any directory level above this folder). Note: This data directory is the required location for your configuration (.fmc) and results (.results) files for Internet forms, but for forms on bethelnet, the .fmc and .results files NEED to be in the same directory(folder) as the form - the data directory is not required.

How to Create a More Complex Web Form (Using Dreamweaver)

Here is how to create a form that will collect the persons name, their e-mail address, their favorite color, their favorite fruit, and some information about why they think their preferences are what they are.

• The name, e-mail address, and favorite fruit uses a Text Field
• The favorite color uses a Check Box
• The why question uses a Text area
• The submit and clear form uses a Button

The Form

Creating a more Complex Configuration File (Using Dreamweaver)

The configuration file is a text only file with configuration commands (See the Form Mail - How To document for all possible commands that you can use) that tell form mail how to process your form. For this form I created a NEW document in Dreamweaver, switched to code view and deleted all the html code and typed the following configuration commands and settings:

[# in front of any configuration parameter disables that parameter]

Follow the steps from above to save and name your configuration file. (e.g. forms-dw.html.fmc)

---

How to Create a (optional) Results/Confirmation Page

You can simply use one of the three default Results/Confirmation Pages and entirely skip this step (Just add stdtemplate=cgcs or stdtemplate=college or stdtemplate=official to the Configuration file). Otherwise you just create a normal html page that will show the form user what they have successfully submitted on your form, and add in the following in the place in your confirmation page that you want the results to appear (add it to the code and not the page text)

<!--%formresults-->

Then save this file and name it with the name of the form and add on .results (e.g. forms-dw.html.results) and also put this file into your data folder (Internet Forms) or the directory (folder) where your form resides (bethelnet forms). (See the Form Mail - How To document for all possible commands that you can use)

---

Finally publish all of your form components to the web server. This form has the following components and all are located in the a folder called Forms in my web site:

• forms.html (your form can have any html compliant name)
• data folder (This folder can be in the same directory as the form, or you may want a common data directory at the root level of your web site in which to place all of your configuration files)
  • forms.html.fmc
  • forms.html.results

What to do if you want to put two forms on one web page:

1) Name each form distinctly. The name of the form needs to be in a hidden form field inside each form, like the following:
<input type="hidden" name="formname" value="form1" />

2) The configuration file can have multiple form configurations. Say we have two forms (form1, form2): the configuration file would look like:

form form1 {
form1 config parameters
}
form form2 {
form2 config parameters
}

3) If your forms are using different templates (.results), then the template name should have the '.form1 or .form2' appended to the end, (e.g. formname.htm.results.form1). However, both forms can use the same template file. If you wish at least one of your forms to use a default template file, name that file: formname.htm.results