< back
Before you start creating a form it is a good idea to have on paper what
you would like your form to do, that is what type of data you would like to
collect from people who fill out the form. Below, instructions are provided
for an example enquiry form.
Inserting the form
- Open the webpage you would like to create the form in
and position the cursor where you would like the form to start.
- From the FrontPage menu, select Insert, Form. You will see two
buttons called Submit and Reset. Press the enter key on your keyboard a
couple of times to create some space within the form above these two
buttons. The dotted line just means that there is a form on the page so you
need to do everything else that is form related within these dotted lines.
- Make sure your cursor is at the top of the form within the dotted
lines and this is where you can start inserting the fields you would like
within your form.
Once you have established what type of field you would like your form to
have, and have inserted it within the form, you need to double click on
it and edit the properties. Form fields by default are given names that
do not mean much when the results are emailed through.
Insert textbox
A textbox provides a space for a name, email address or a telephone
number. If you require more room, then the textarea field can be used.
- Type the word: Name:
- From the menu, select Insert, Form, Textbox.
- You need to change the Form field properties by double clicking on the
textbox.
- Change the name T1 to something more relevant, in this case Name.
Note: Field names should not have spaces in them or use special
characters. Underscores can be used
- If you would like to make the textbox longer change the width in
characters to the length you require. The default is 20.
- Select OK when you have finished editing the properties.
Insert textarea
A textarea provides more space for people to type their addresses,
comments etc.
- Type the words: Your address:
- From the menu, select, Insert, Form, Textarea
- Double click the Textarea and change the name properties to: Address
- Change the size of the textarea by changing the width in characters,
and number of lines you require.
- Select OK.
- You can also change the sizes of textboxes and textareas by selecting
it, and clicking and dragging the square placeholders.
Insert option button (radio button)
Option buttons or radio buttons provide a way of people selecting one
option only. If you require them to select more than one option you will
need to use a Checkbox
- Type the words: Would you like a prospectus?:
- From the menu select, Insert, Form, Option Button, type the word: Yes
- Repeat the last step but type the word: No.
- Edit the properties of the Option Buttons:
- Name the group for both buttons Prospectus (this means that the
person filling in the form can only select one button)
- Give the first button the Value of Yes and the second button the
Value of No
- Set the initial value for both to Not selected. You can have one of
the buttons set to Selected - it's up to you.
Insert checkboxes
Use Checkboxes if you want the option of more than one item to be
selected.
- Type the words: Select the discipline area/s you are interested in
studying:
- From the menu select, Insert, Form, Checkbox, type the word
Engineering
- Repeat this for Communications and Health sciences
- Edit the properties for each checkbox and give each one an appropriate
name. In this instance you could do something like:
Discipline_Engineering, Discipline_Communications
- You can leave the Value as On. When the check box is selected, this
value is returned with the form results. If the checkbox has not been
selected, the name is included, but the value is blank.
Now you have created a basic form using FrontPage. The next step is to
create a confirmation page, probably using the no left hand menu
template.
Insert label
Using labels in your forms improves
accessibility by providing a link between the text and form
item (checkbox etc). Inserting a label means you can click on the word next to the
form field to select it rather than just clicking on the form field
itself. This helps out people using screen readers and others who may
have trouble clicking in a small area on a screen.
Try it out on this test form.
After creating the form field and typing the label text select the form
field and associated label text. Select Insert, Form, Label. If
you now view the code for this form field you will see the <label> and
</label> tags either side of the form item.
Dotted lines will appear around the text associated with the form field.
Now you are ready to convert the form so that it
can be submitted.
top^
