How to create a custom form related to upcoming church events (tutorial)

This form tutorial will walk you through creating a form for a specific event and follows very closely this webinar video tutorial. This tutorial may be used as a model for forms you want to create for your event, making modifications that meet your specific needs. The form we will create in this article tutorial will look like the image below. Skip down to Sections in the tutorial.  

Sections in this Tutorial

• Basic setup (general form properties)
• How to add contact fields 
• How to add basic information fields
• How to add static content - such as static text or divider bars
• How to add conditional logic  - so the text only displays when necessary
• How to add payment amount calculation prompts
• How to add payment options
• How to add email notifications
• How to add an image
• How to change the theme

How to create the form - basic setup

1. Begin by selecting + Create New Form which takes you into the Form Manager.
   
2. This tutorial uses the Start From Scratch option. When you are ready to create your own form, please feel free to check out the other form templates provided for your convenience.
   
   • Select the Start From Scratch icon.
   • Enter the name of your event; in this tutorial, we are naming our event, 'Dinner of Giving.'
   • Click Start Building Form.  
3. Click FORM PROPERTIES at the bottom of the Form Manager.
   
4. In the General Info Tab, begin by adding a description of how this form will be used. Then scroll down the page to update some form settings.
   
5. You will need to make some decisions on your FIELD VALIDATION options. These are personal preference options. In this tutorial, we are marking DISPLAY REQUIRED BESIDE REQUIRED FIELDS.  
   
6. For now, we are going to skip down to the area on the General Info tab labeled CATEGORIES. Here we will mark Event Registration.
   
7. Then, just below that, choose the date of your event. This will conclude the basic form setup work.
   
8. We will now move on to the SUBMISSION page. Click SUBMISSION at the top of the page shown in the screenshot below.
   • Toward the top left under SUBMIT BUTTON TEXT, enter the text you would like to display on the 'Submit Registration Button.' This is the button at the bottom of our completed form as shown here.
   • For organizational purposes, enter the number of dining seats available in the field labeled MAXIMUM NUMBER OF SUBMISSIONS. 
   • For the sake of this tutorial, the SUBMISSION CLOSE DATE is also the date of the event. These fields are a combination of personal preference and the facts of your own event.
     
9. The next areas on the submission form (as you scroll down) are the messages you want your members to receive when either they attempt to register but the maximum number of registrants has already been reached or when registration is successful.
   • You may add simple text and use the word processing options at the top of the window to add different word processing elements such as bold, italics, etc. 
   • Advanced option: In the MAX SUBMISSIONS window, you may add a link to your online giving page. That way, people who are not able to sign up for the dinner due to the maximum number being reached, will have the easy option to give to the Thanksgiving Fund right then. To do this, you must highlight the text representing the link and then click the link button. This opens a new window which allows you to add the link to your online giving page, as an example.
   • The field below the MAX SUBMISSIONS EXCEEDED... message allows you to enter the text you want to be displayed when the registrant completes the registration process successfully. In this tutorial, we have added the message, 'Thank You! You have successfully registered for the Dinner of Giving.'
     
10. At the bottom of the Submission page, there is a field where you may enter the REDIRECT URL. Here, enter the web site you want the registrant to land on once they have submitted their registration form. For example, the website for your church.
    
    
     

12. To save and view your form
    • Click OK at the bottom of the form.
      
      
      • If you want to view the form so far, click on the button, PREVIEW FORM. To get back into edit mode, click the gear icon to the right of the form title.
        
      • Select SAVE CHANGES. 
        • Once you select SAVE CHANGES, you will be prompted to SAVE ONLY or to PUBLISH. For this tutorial, choose PUBLISH.
          
        • Once the form is published, the only way for the public to access the form is through the link. Until you publish the link, no one will be able to access the form. 
        • Later in this tutorial, you will learn how to find the link so you may publish it for your members' use.

How to add fields to your form - Contact Information Fields

The contact information fields are helpful in many ways. They not only help gather information about the registrant but also, if the registrant has an existing account, the account information will auto-fill. For this tutorial, we will simply walk through adding fields to your form. For detailed information on adding fields to your form, see the article, How to add delete or move fields on a form. 

1. Add the Person's Name field to your form by clicking on the field name from the right-side menu. There are three areas for each field: General Info, Validation, Conditions.
   
   • General Info: Enter the general field name you want to display above the field. For this tutorial, we are changing the field name from Person's Name to Name.
   • Validation: Mark if this field is required.
   • Conditions: Under what conditions are this field displayed?  For this tutorial, we are leaving the option marked for ALWAYS SHOW FIELD.
   • To exit from the Field Properties form, click OK at the bottom-right.
2. Add the Email field to your form by simply clicking on the Email field on the right-side menu.
   • Since you are adding this field after adding the name field, it will automatically be placed below the name field on the form.
   • Once again, the Field Properties menu will automatically open. For this tutorial, we will not update the properties for this field, but you may obtain additional information on adding the email field in this article. To exit the Field Properties form, click OK at the bottom-right.
3. Add the Phone Number field to your form.
   
   At any point in this tutorial, you may save the form and or preview the form to see how it looks so far.

How to add fields to your form - Basic Fields

Radio Button

This is a good place in the tutorial to add a radio button from the Basic Fields menu to find out the registrants preferred method of contact.

1. Click the Radio Button option under Basic Fields.
   
2. In the General Info tab, update the name of the field to 'WHAT IS THE BEST WAY TO REACH YOU?' Then, go into the options page and add the two options: Phone and Email. Click OK.
   
3. We purposely left the MAX AMOUNT OF COLUMNS as 1 for the 'Best way to reach you' radio button fields. To show the difference, we will change that option to 2. Click the gear option to the right of the contact preference field and in the OPTIONS page, change the MAX AMOUNT OF COLUMNS, shown in the image above outline in navy, to 2.
   How the form displays when 1 is chosen.
   
   
   How the form displays when 2 is chosen.
   
4. Another use of radio button fields for this form is the entree selection. For this tutorial, repeat the steps above for adding a radio button.
   • This time give it the name, 'Please choose your Dinner Entree.' 
   • Add four options: Beef, Chicken, Vegetarian, Vegan
   • Use 1 column.
     
     At any point in this tutorial, you may save the form and or preview the form to see how it looks so far.

Long Text Field

The next field type we will add is a long text field in order to allow the registrant to add information about food allergies.

1. Click the Long Text field under Basic Fields.
   
2. This will automatically place this field at the end of your form and open the field properties window. Update the name of the field to, Please list any food allergies, and click OK. At this point, we will keep all the other properties of this field as their default values.
   
   At any point in this tutorial, you may save the form and or preview the form to see how it looks so far.

How to add static content to your form

As you build your form, you may want to set one section apart from another. Using the Static Content fields will help you do so.

Static Text: Adding static text allows you to choose the text which displays to the screen.
    

1. From the right-side menu, select Static Text under the Static Content section.
   • This field will automatically open to the Static Content Properties window where you may enter the text you wish to display at this point on your form.
2. In this tutorial, we model adding the tilde character. Note if you repeat the character too far to the right, it will seem to go off the screen. Play around with it a little to determine the best width.
   
3. By way of practice and comparison, after adding the Tilde Static Text line, select the Divider field from the Static Content section. This will allow you to see the difference between the two. Again, which you choose for your forms is a personal preference. After adding the Static Text line and viewing it to compare the difference between the two, remove one of the two Static Content fields for this tutorial.
   
   At any point in this tutorial, you may save the form and or preview the form to see how it looks so far.

How to add conditional logic to your form 

This next prompt we are adding to our tutorial form will be to find out if the registrant is coming alone or inviting guests to the dinner. The following prompts will depend on the answer to this one.

1. Add a Radio Button prompt named, Will anyone else be attending the dinner with you?
   • Options: Add two - Yes, No. 
   • Options: Make this field a two column field.
   • Validation: Make this prompt a required field.
2. Add a conditional drop-down field asking how many guests.
   
   
   • Select the Dropdown field from the Basic Fields menu.
   • In General Info, add the name, How many additional members in your party?
   • In Options, add options for 1 - 3
   • In Conditions, mark the radio button for Under certain conditions and below that select the text, Will anyone else be attending the dinner with you? and Yes. Adding this condition will ensure the next prompts asking for guest information will only display when the registrant is not attending alone.
     
3.  Now, conditional fields must be added for additional guests. We will only walk through adding the fields for one guest in detail, but you will get the idea. Since we have already added these same fields for the original registrant, we will only give the necessary information for each field.
   
            Guest #1
   
   • Add a divider field only to display when the prompt 'Will anyone else be attending the dinner with you?' prompt has been answered yes. Note: Use this condition for all the fields for Guest #1.
   • Add two short text fields named First Name and Last Name which are displayed only under the condition that the Will anyone else be attending the dinner with you? prompt has been answered yes.
   • Add the radio button options for beef, chicken, vegetarian, and vegan under the condition that the Will anyone else be attending the dinner with you? prompt has been answered yes.
   • Add the long text field regarding allergies under the condition that the Will anyone else be attending the dinner with you? prompt has been answered yes.
     
     Guests #2 & #3
   • Add a divider field and all of the other fields that were just added for Guest #1, now for Guest #2 and then for Guest #3. Besides the text in the name fields, the difference is the condition. These fields are only to display when the prompt for How many additional members in your party? matches 2 or 3 for Guest #2 and matches 3 for Guest #3.
     

If you choose, you may save the form and or preview the form to see how it looks so far.

How to add payment information prompts

For this tutorial, we are going to use the Calculated Amount payment field. This option allows you to select into which fund you want all funds to go.
 

• Update the name of the field to something that makes sense for how you are using it.
• Change the Item Name to reflect what the registrant is paying for. In this case, it is the number of plates which will be served.
• The total quantity of items is very important to enter. When you first created the form, you added the 350 under the maximum number of submissions. You would only have 350 submissions, though, if each person registered only for themselves. Since each registrant may sign up three additional guests, you will reach the 350 plates (items) before you reach the 350 submissions. Since there are only 350 spots available, it's very important to set this limit.
• Add the price of the meal
• Select the Fund to which these donations will be made.
• Make sure to only mark the Tax Deductible option for Tax Deductible donations.

If you choose, you may save the form and or preview the form to see how it looks so far.

How to add Payment settings to the form

1. Click on the PAYMENT tab at the top of the page.
2. For this tutorial, under MEMBER PORTAL mark both options: ENABLE MEMBER PORTAL and ENABLE RECURRING PAYMENTS.
   • Recurring Payments may not be enabled unless the Member Portal is first enabled. 
   • Enabling Member Portal will allow the member to create an account or use an existing account and to store their payment information.
3. For this tutorial, we will accept ACH and Credit/Debit Card payments omitting only American Express as a card type.
4. A fund must be selected so the donation is designated correctly.
5. Once you have filled in all of the Payment options, click OK and then save your changes. 

How to set up email notifications

Once your registrant signs up and pays for the event, they get a message on the screen letting them know they signed up successfully. You may also add email notification functionality so they also get an email confirmation.

1. In Form Properties, select the EMAIL tab at the top. Then click the green ADD EMAIL button.
   
2. To set up the form so it emails the registrant, type in #Email# in the TO field.
   • If you prefer, you may click on the EMAIL button found under PLACEHOLDERS.
   • If you do this, the placeholder, #Email#, will pop into the message body.
   • You may then copy and paste it in the correct spot.
     • Select the placeholder, depress the Ctrl key and the x key at the same time.
     • Click into the TO field and depress the Ctrl key and the v key at the same time.
       
3. Add the email of the church administrator to the FROM field.
4. Enter the subject of your email notification.
5. Use the Placeholders to fill in information specific to this registrant and their guests in the body of the email. You may play around with it until you are satisfied.
6. Each time you click on a Placeholder, it will place it in the Body of the form where your cursor is. If you want to move it, you may cut and paste it. Alternatively, you may simply type in the placeholder text by adding the hashtag before and after the field name.

Note that if you scroll down while on the Email page of Form Properties, there is another ADD EMAIL button. You may also add an email that goes to the event's administrator so they may update their records accordingly. The rules are the same. You would simply use the event administrator's email in the TO field and include all of the information they request. To continue with this tutorial, please add this additional email.

How to add an image to your form

1. Select FORM PROPERTIES at the bottom of the page.
   
2. Select the UPLOAD IMAGE button then browse for and select your image.
   
3. Click OK at the bottom of the form and save/publish your changes. The form will now have an image just as the one shown here.

If you choose, you may save the form and or preview the form to see how it looks so far.

How to change the theme of your form

You may change the theme of your form by selecting the THEME tab in Form Properties. The theme you use is a personal preference, and you may play around with your theme selection until you find a setting that is appealing to you. When selecting a theme, note the color bars represent the following: Left Color Bar - form background color; Middle Color Bar - form word color; Right Color Bar - form title and options color. For this tutorial, try various these options to see which you prefer for this event.

April 17, 2023 17:48