Creating a Form on the Website

Creating an form on this website is actually faster and easier than typing a manual form on Word because you don't have to do all the spacing.

1. To make a new on-line data-entry form, click "Webform" on the bottom of any page.  Any site user can create Webforms.

2. Give the name and description that the users will see when they go to create the form. If you want to put your form on the Church pages menu, click on "Menu Settings" and enter the "Menu Link Title" (which is what uses will see on the menu) and then uses the "Parent" item pulldown (the down arrow) to see items on the Church Pages menu under which you can put the new menu item taking people to the form.    Click the "Save" button on the bottom of the page.

To see an example of a form without a menu item, see the Vacation Bible School form here: http://shorelinecovenant.org/content/vacation-bible-school-signup-form

3. This takes you to the form Components page. This is where you enter the data entry fields for the form. See the VBS components setup here: http://shorelinecovenant.org/node/511/webform

At the bottom of the VBS form is the blank area used to add more form "components". 

4. To enter a new component on a new form enter the Label you want to users to see on the form above or next to the data entry area. Select the type data entry area using the pull-down menu (click on down arrow). Most are obvious. Ignore the complex ones (file, grid, hidden markup). You can see many of these types used in VBS form above. Here is a short description of each type you will use: 

Date:  a date of a month/day/year.

E-Mail: users e-mail address (used for mail responses)

Fieldset: This sets up a section dividing the form and doesn't actually take any data but separates data sections.

Number: data entry area that only accepts numbers.

Page break: This divides the form into separate pages.

Select option: For entering check boxes or pull-down menus offering a series of options.

Textarea: For entering multiple lines of information.

Textfield: For entering a single line of information.

Time: For entering a time in hours:minutes

5. To require users to enter this type of data, click on Mandatory to check the box.

6. To add the new component, click "Add". 

7. Adding a component will bring you to a screen where you can detail information about it. In the existing VBS form above, you can use the "Edit" button on right for any existing component to see how detail (like multiple choice options) is entered.  This information always includes:

Label: to change label you entered above.

Field_Key: This is unique name for data entry field, for example, when you have multiple Address lines, you make one address_1 and another Address_2. This is the name you see next to the data in the email version of a filled form that the system sends you.

Description: This is the "help" area appearing below the data entry area which explains what is required in the field in more detail. 

Maxlength: This is maximum number of characters that can be entered into the data entry area. It can be left blank.

Width: This is the width of the data entry area  in number of characters as it appears on form. It can be left blank.

Label placed to right/left of textfield (for things like "$" for money on left or "gallons" for units on right. Not the same as field Label above.

Label Display: Default is to put label above data entry area, but for most you may want to put the label "Inline" so it precedes the data.

Other specialized information, such as different options for "Select Option" are a little more complex, but see VBS form (Boy/Girl) for examples.

8. Save component by clicking "Save Component" at bottom.

9. Click on "cross" in front of component to reposition a component on the form. You MUST click SAVE at the bottom to save these adjustments. 

10. Change the setup for any component using the "Edit" link that follows it.

11. Rather than re-enter very similar component, you can copy an existing component using the  "Clone" link following a component. You must make the Field_key unique usually by adding a number after it to indicate its position on the form. (See multiple Child Name items in VB S form.)

12. SET UP EMAILS. This emails filled out forms to someone in the organization.   You enter mail information using "Email" next for "Form Components" tab near the top. If you cannot see these tabs, click Webform tab under the form name.  See VBS example:

http://shorelinecovenant.org/node/511/webform/emails

12. You  enter confirmation page using "Form Setting". Example:

http://shorelinecovenant.org/node/511/webform/configure

13. On all these creation pages, ignore everything whose use isn't obvious.

 14. You can also see all the filled-out forms under the Results tab under the form title of webform.