Adding a Web Form with a Wizard

WyzGuys Computer Tutors

Computer Instruction. Web Design Instruction, and Web Hosting

Adding a Web Form with a Wizard

Site Navigation

Day One

Day Two

Day Three

Day Four

We use and recommend

for your on-line transactions

Web Forms

Web forms allow you to include a place for visitor feedback, requests for information, on-line purchases of goods or services, user registration, and more. Traditional designers use CGI scripting in languages like Perl. You don't need to learn a scripting or programming language; FrontPage will do all the scripting, and a lot of the design work for you.

We are going to learn how to use the FrontPage Forms Wizard in this lesson, and how to design forms manually in the next. You may never design a form from scratch, but you may want to modify a form you create with a wizard, so knowing how to do both is useful.

A web form is contains inside a dotted square that represents the <form></form> tags in the HTML code. It is composed of a series of tables with areas for user input. The results are stored in a database (.CSV) file in a special folder (_private) in the site. The form entries can also be sent to you by e-mail.

When we use the wizard, FrontPage will actually create the form and a new page to hold it. You may move the form using cut and paste, but in my experience, the form outline may not move with the contents. Usually, I will insert a new form outline into the destination page before moving the form contents.

Starting the Wizard

We are going to create a Feedback form on a new Feedback Page for our practice site.

Step 1

Click on File, New.

Step 2

Click on More page templates on the New Task Bar.

Step 3

You might want to take a minute at the page templates that are available in FrontPage. You can also start a Photo Gallery from this dialog. You might want to notice the Search Page, since we will be coming back to this a little later.

When the Page Templates dialog opens, select the Form Page Wizard and click OK.

Step 4

Read the instructions and click on Next.

Step 5

Click on Add, Next.

This page will return after we complete each section of the form.

Step 6

This page allows you to select what kind of information the form will collect.

After you complete a form section, you will have the opportunity to return to this page and select other predefined information blocks.

Select contact information from the list.
Notice the Description.
You may edit the prompt question if you prefer something different.
Click on Next.

Step 7

Choose the information you want to gather in the form.

Change the Name from full to first, last. This creates 2 name fields and allows you to sort the data later by last name.
Check or uncheck the boxes in the next section to collect the information you want.
You can change the variable name if you wish. This name shows up in the database, but not on your site.
Click on Next.

Step 8

Click on Add, Next.

Step 9

Select paragraph from the bottom of the list, edit the prompt question and click on Next.

Step 10

Type Comments in the variable box.

Step 11

Click on Next.

Step 12

We move on to the next step, which determines how the form will be presented to the visitor.

Change the first selection to normal paragraphs. You should notice the other options available to you. For example, if you were using the for for an on-line quiz or test, you might want to used a number list.
Select NO for Table of Contents.
Check the use tables option.

Step 13

Click save the results to a text file.
Change the name to feedbackform, and click Next.

Step 14

We have finished the form.

Click Finish.

Step 15

You new page should look like the one below. You need to save it and add it to your web structure, as you would any new page.

Be sure to at this page to your Navigation Bar.

You may need to add Shared Borders and your Theme to this page, do so from the Format menu. Be sure to apply the Shared Border to All Pages.

To see how the Form works, change to the Preview View and try filling it out.

Back

To Exercise

Next

Curriculum developed by WyzGuys Computer Tutors

Hosted by WyzHost.com

contact support@wyzhost.com