Creating Form in FrontPage 2000 with formmail.pl

 

Close this window to get back to the tutorial.

 

Step 1.1:

1) Click onto [Insert], then scroll to the [Form] section. Move your mouse over to the top of the blue section as shown below with the arrow.

 
 


2) Next, click and drag from the blue section, to take out this popup to be a menu float.

 

 

Step 1.2:

 

Status Bar

 

1)       There, you’ll see this [Form] menu float.

 

2)       Click & drag from the top of the menu float, and slot it into the status bar.

 

 

Step 1.3:

 

Click ONCE on the icon [abl] aka (One-Line Text Box), then it will appear a form format (the dotted line frame) together with the one-line text box & the submit & reset buttons, as shown in the above.

 

After slotting in the menu float, it becomes part of the status bar.

 

 

 

Step 1.4:

 

1) Press [Enter] a few times, to make some space for the table. Remember to click your blinking cursor in the form format between the one-line text box & the buttons.

 

2) Then, click on the [Table] shortcut that is on the status bar.

3) Click & drag a 12 rows by 2 columns table,  & then release your left click.

 

 

 

Step 1.5:

 

2) Click & drag the one-line text box to the first row second column of the table.

 

1) After Step 4, you can resize your table as shown below, or even edit the table borders to become invisible by right clicking in the table, then scroll to [Table properties].

 

 

 

Step 1.6:

 

To resize the one-line text box, click & drag the right hand corner of the squares, as shown in the above.

 

Then, right click [copy] this form field, & paste it on the next row (shown in step 7).

 

 

 

 

Step 1.7:

 

Paste the [copied] one-line text box onto the next row.

 

 

 

Step 1.8:

 

You can type in whatever input

Components on the left side of the table, as shown here.

 

Click on this icon [abcd] shown with the blue arrow, it displays a scrolling text box.

 

 

 

 

 

 

Check Box & radio button

 

Scrolling Text box

 
Step 1.9:

 


To add items in this field, double click onto it, a popup will appear, as shown in step 10.

 

A drop down menu

 

One-line text box

 

 

 

Step 1.10:

 

Always change the Name “D1” to its component name “country”  (which is displayed on the left side of the table).

 

 

 

 

 

 

Step 1.11:

 

 

 

Step 1.12:

 

Then click [OK], when finished adding.

 

Once finished changing the field’s name, click onto [Add] button to add a list of items in this drop down menu. The first item would be the first to show in the drop down menu. I would suggest adding “Please Select One” as the 1st item, so that this would prompt the user to choose an item (e.g. product, country, and service) from the list (drop down menu).

 

 

 

 

 

 

Step 1.13:

 

You’ll see the added item in list in here. Next, we add more items (choices) in this list as shown step 14.

 

 

 

Step 1.14:

 

After every desired item is added in, then click [OK].

 

To rearrange the order of the items, highlight on the item, & either click [Move Up] or [Move Down].

 

To delete the item, click on [Remove].

 

To make changes to the item, highlight on the item, & click [Modify].

 

Add items

 

 

 

 

 

 

Step 1.15:

 

When you input radio buttons, always take note to change the [Group Name] to the component’s Name “Agenda” & the [Value] to the item’s name “Feb” (as shown in the above), which goes the same process for the item “Mar”. 

 

 

 

 

 

 

Step 1.16:

 

PLEASE NOTE:

 

Double click into all the form fields, and change the properties’ name (e.g. A1, D2, D3 …etc) to its component name (e.g. name, email, tel, fax) as shown in Step 10. Preferably all in small letters/ lowercase.

 

Whenever you finished your work, please click [SAVE].

 

 

 

 

 

 

 

 

 

 

 

INSTRUCTIONS GUIDE LINES OF HOW TO INPUT FORMMAIL IN A FORM

 

Step 2.1: *******

(Inputting of formmail.pl & sending of form details to an email address)

 

Right Click within the form format, and select form properties.

 

 

 

Step 2.2:

 

You add in a Name for this form. E.g. “Contact Us”.

 

Then, select the radio button for [Send to other]

 

 

 

Step 2.3:

 

2) A popup will appear. Now, in the [Action] input text box, type in this line: cgi-shl/formmail.pl

Leave the rest of the input boxes as they are. Then click [OK]. The picture here shows the exact format.

 

1) After doing Step 18, please click on [Options ..] button.

 

 

 

Step 2.4:

2) In the [Name] input text box, please type in: recipient. Then in the [Value] input text box please type in: (your own domain name email address). E.g. sales@cybersite.com.sg BUT NOT your ISP (singnet, pacific net) or free email  (hotmail, yahoo) addresses, b’cos they will block the form submission path. Then, click [OK]

 
 


1) After Step 19, click onto  [Advanced …] button. Then, click onto the [Add …] button, you’ll see this popup [Name/Value Pair] query box.

 

 

 

Step 2.5:

In Step 20, we are actually inputting a hidden field html tag (a line before </form> ):

<input type="hidden" name="recipient" value=”your email address”>.

DO NOT CHANGE THE [Name] “recipient” to another name!!

Just for your information!

 
 


Once finished, click [OK]. Then SAVE.

 

If you want to change your email address, highlight the item, then click on modify. It’ll go back to step 20 dialog again. Click on [remove], it’ll delete the item.

 

 

 

 

Step 2.6:

 

Now, we go to [View] to open our [Folder List], & add in a cgi-shl folder within this website folder.

 

 

 

 

Step 2.7:

 

We highlight the main folder (the website folder where you saved the web pages in), then right click & select [New Folder]. Then click on it.

 

This is the folder list

 

 

 

Step 2.8:

 

Then change the [New Folder] name to cgi-shl. And please SAVE your work again. Then minimize this frontpage2000 window.

 

 

 

 

 

Step 2.9:

 

Open (double click on) the Formmail.pl file.