Building a Form with the v5 Forms Module

One of the newest optional features of v5 is the Forms Module. This module allows you to quickly build and deploy forms to your website. Its simple and easy, just follow the steps below.

To begin, open up the Forms Module tab {if you don't have this tab ask us about how you can get it}


Creating a new Form

Step 1- Enter the title of the new form into the blank field

form1.jpg

 

Step 2- Find the new form title in the list of forms and click on it to edit

form2.jpg

Adding Fields to the Form

Step 1- Click on the "Fields" tab and click on "Add a field"

form3.jpg

 

Step 2- Enter in the information for the Field

form4.jpg

 

1. Name- this is the name that will appear in the database and be used to call on the response that is submitted. This will not be seen by the front end user. For example: first_name

2. Question Type- this determines what format the question is in.

  • Short Answer- a short blank field, best used for things such as Name, Address, Email etc.
  • Long Answer- a large text box, best used for messages or comments
  • Select (dropdown) list- allows the user to select one item from a dropdown box
  • Checkbox- puts a checkbox next to one item, best used for Agreements (Yes, I agree to the terms)
  • Checkbox List- creates a list of items with a checkbox, users can select multiple items. Best used for selecting several products etc.
  • Radio Buttons- creates a list of items with the ability to only select one item to submit
  • Description Area- a blank textile content area where you can add titles and information. You can format with headers etc. using textile markup. Best for survey titles and details as well as section headers to break up the form

3. Required box- by checking this a user must answer this question before being allowed to submit the form. If a user tries to submit without filling out this field the form will show an error message indicating they must fill out the field.

4. Label- this is how the text or name of the field will be displayed to the user on the front end. For example: First Name

5. Hint- this is optional. You can use this area to provide an explanation for the user as to how to fill out the field properly. For example: Please enter your first name in the space provided

6. HTML Class- allows you to add extra elements to the field. Mainly used by Trabian Technology.


Step 2- Hit "Create" to save the field and add it to the Form.

Repeat this process for all Fields you would like in the form. You can re-order your questions by dragging and dropping the Fields in the order you want.


Step 3- Hit "Save Form" in top right hand corner to save your changes to the section
 

Adding a Success Message

Step 1- Click on the "Success Message" tab 

Step 2- Enter in the information to set up the success message that will be seen by users after hitting Submit

form5.jpg

Step 3- Hit "Save Form" in top right hand corner to save your changes to the section


Setting up the Email Notification
The email notification is the email that will be sent to the credit union and contains all submitted data. WARNING: If this is not set up properly data submitted will be lost and cannot be recovered by Trabian.

Step 1- Click on the "Email Notification" tab 

Step 2Enter in the information to set up the email notification 

form6.jpg

1. To- this is the email address to which the data will be sent. You can have multiple email addresses separated by commas. For example: admin@trabian.com
     1a- Secure Email transmission- to set up a secure form (any form containing sensitive member information) you will need to set up an S/MIME certificate through Trabian Technology. The certificates are created per email address and require installation by the person with that email. Once this is set up you can check this box to secure the form data. WARNING: if the email address listed in to the "To" field does not have a certificate the data will not go through and will be 
lost.

2. From- this is the email address that will be shown as the From Address in the email inbox. This email address needs to be on that will not be moved to Spam by your email server. You can use the same email address at the To email if you wish.

3. Subject- this will appear in the Subject line of the data email. Should be related to the form.

4. Body- this is where you have the ability to customize the body of the email sent. If you select to use the default notification email the data will come through with no labels. By setting up a custom body then you can add titles, labels for each field etc. WARNING: if you select to customize you must input the field names or the data will not come through and will be lost.

Step 3- Hit "Save Form" in top right hand corner to save your changes to the section


Setting up the Email Confirmation
The email confirmation is the email that will be sent to the user who submitted the form. This is optional and does not have to be completed. Note: In order for the email to be sent there must be a required email field within the form.

Step 1- Click on the "Email Confirmation" tab 

Step 2- Enter in the information to set up the email notification 

form7.jpg


1. From- this is the email address that will show who its form when hitting the users inbox. This is also the email that users might try and respond to. It should be a working familiar email address.

2. Subject- the subject of the email that will come across in the users inbox

3. Body- the email body content that will be seen by the user
 

Step 3- Hit "Save Form" in top right hand corner to save your changes to the section


Your form is now complete and is ready to be placed within a page of the website.


Placing a Form on a Page

Step 1- Navigate to the page within the CMS Admin where you want the form to be located

Step 2- Place the cursor at the point in the page where you want the form

Step 3- Click on the Forms button in the editing toolbar to open up the Form Browser

form8.jpg

Step 4- Select the form you wish to use form the list of forms in the browser

form9.jpg

 

Step 5- Enter in any supporting text etc. on the content page

Step 6- Save>Submit>Approve the page

Your form is now live! At this point users can access the form and submit data.

form10.jpg

 

From this point forward you can continue to access the form in the Forms Module to add/edit/delete fields or edit any of the other pieces of the form. Once saved these changes wil be automatically made to the form wherever its placed within your site.

 

 

We hope you found this information helpful.  If you have questions or comments please post to this topic.

Thanks,

Team Trabian

Have more questions? Submit a request

Comments

Powered by Zendesk