Komosion - Komodo CMS Form Builder User Guide

Komodo CMS – Form Builder User GuideVersion 4

ContactMelbourneL1, 33 Tope StreetSouth Melbourne Vic 3205T: +61 3 9282 9888

SydneyL2, 68 Moncur StreetWoollahra NSW 2025T: +61 2 9302 0200

Komodo CMS – Form Builder

Form Builder ModuleCreate web forms (surveys, polls etc) in minutes. The non-technical form builder includes email and data management and a separate testing environment.

The Form Builder Module can be accessed from the Komodo grey menu bar under the Module drop down list (Fig.1).

Fig.1

Creating FormsTo kick off the process, click on Add New Form button (Fig.2) and give your form a name (Fig.3). Scroll to the bottom of this window and save the change. We will return to the Form Details page later.

TIP: This widow is also where you’ll access the complete list of forms you have created and where you come to edit and export data from the records (from the Form Data tab).

Fig.2

After you select Add New Form, you will be directed to the Form Details tab (Fig.3). Next, give your form a Fig.3

The next step is to link your form to the page where it will be accessed from. To do this, go to the relevant page and navigate to the dropdown Komodo > page properties in the grey menu bar. Select the Form Tab from within the page editor, and then the form you are linking to (Fig.4). Remember to save the changes as you move through these stages.

www.komosion.com 2

Komodo CMS – Form Builder

Please note, only one form can live on a webpage at the one time.

Fig.4

Now you are ready to design your form.

It is a good idea to set up a table (to create tables, please refer to the Komodo CMS General User Guide – page 15) which will give your form a professional structure. For each form field you also need to include a text label so using a table is the neatest way to achieve this. See Fig.5 below for an example of the structure to use. Ultimately, the way you set-out your from is entirely up to you.

Fig.5

www.komosion.com 3

Komodo CMS – Form Builder

To add a form field, select Add New Item from the menu bar and then select Form Builder (Fig.6). This will give you a range of form fields to choose from including:

Text Field Drop Down Menu Checkbox Radio Button List Form Button Spam Blocker

Fig.6

Let’s take a closer look at each Form Builder field options.

www.komosion.com 4

Komodo CMS – Form Builder

Fig.7

Text Field

A text field gives you the option of a text box or a text area (Fig.7) and you can choose the width you require. Using the style list you can also choose the text style you would like used in the box.

Select ‘Mandatory: Yes’ to make this a required field.

Tip: Ensure the field name corresponds with the front end field name for easy identification and selection when it’s time to set up the backend of your form.

Fig.8

Drop Down Menu

A Drop Down menu (Fig.8) allows you to add multiple options for a user to select from. You can choose the width you require, the style of text as well as making the field mandatory. Choose a default option to attract attention.

www.komosion.com 5

Komodo CMS – Form Builder

CheckboxA Form Checkbox allows you to gather data on multiple areas and gives you the option of a text box or a text area and you can choose the width you require. Using the style list you can also choose the text style you would like used in the box. Select ‘Mandatory: Yes’ to make this a required field. Please note, you’ll need to create a check box for each individual criteria (as seen in the screen capture below).

Fig.9Radio ListUsing Radio List buttons limits respondents to choosing only one option. So, if you need yes or no answer to a question, this is the form field to use. Once again, you can choose style of text, make the field mandatory and choose a default option to attract the web user’s attention. There is also the option of displaying radio buttons vertically or horizontally.

www.komosion.com 6

Komodo CMS – Form Builder

Fig.11Spam Blocker Web bots and spiders crawl through websites looking for unsecure web forms to fill out and inundate email inboxes with spam junk. To ensure your email inbox is not one of these always add the spam blocker (Fig.11) before the form submit button.

Fig.12 Submit buttonThere are two types of buttons you can select from – standard button (Fig.12) and image (Fig.13)

For both options there are 3 types of form buttons: Complete Form Entry; Continue Form Entry – use this if your form continues over another page or several pages; Cancel Form Entry.

You can choose the text displayed on the button as well as the destination a respondent goes to after they click on submit, like a ‘Thank you’ page.

www.komosion.com 7

Komodo CMS – Form Builder

Fig.13Submit button...cont.

If you select the image display for the button, you will need to first upload the image to the file directory and then click on ‘Select File’ to attach the button image.

Complete all other parameters as required.

The next steps are to set-up the administrator area so you can direct where and to whom the submitted form data goes to in your organisation.

Form Settings

After you have created your form by adding the required fields, return to the Form manager (Fig.2) and click on the form in the Form Name column. You will see the following sections and options:

Visitor Email

This function sets up an automatic email response to respondents who complete the form. You will need to have an email address field set up in your form for this option. Simply enter the email address you would like the email to be sent from, the message (in Email Content) and select the email address field from the Recipient Email Address Field dropdown (see screen capture of next page).

www.komosion.com 8

Komodo CMS – Form Builder

Administrator Email

This function sets up an automatic alert to the form owner(s) with the details of form entries. Simply enter the email address you would like displayed (eg. [email protected]), the email address of the recipient (unlimited), the subject and the content you want displayed. Use the Add Field Response To Email list to select the information you would like included in the email.

www.komosion.com 9

Komodo CMS – Form Builder

It’s important to place each recipients email on a separate line – ensure no spacing and comas are added after each email address.

Missing Mandatory Fields Notification OptionsUse this to alert respondents if they have not completed mandatory fields. Add as such as “please complete the following missing mandatory field(s)” and then choose whether to set the message to occur for each mandatory field or all at once.

Remember to always save your form details.

As well as setting-up email notification to the form owner(s), the system automatically collects and stores the form data in a separate part of the form manager module to enable it to be exported at any time.

Collect Form DataCollecting and analysing form data is made very easy with the export option included with the Form Builder module. To export your data, return to the Form manager (Fig.1), select the relevant form and then the Form Data tab. You will see the options to either Export Data or to Clear Data.

Export Data – data is exported into an excel spreadsheet which allows you to analyse the responses, prepare graphs and charts, reports etc.

Clear All Response Data – this will permanently clear all the response data from form. Make sure you have exported and recorded the details before you select the option.

Tip: Always test your form to ensure all fields are captured and that the recipient and administrator emails have been set-up correctly and are capturing all the data as anticipated.

www.komosion.com 10

Komosion Pty LtdABN 84128837123

MelbourneFirst Floor, 33 Tope StreetSouth Melbourne VIC 3205 Australiat +61 3 9282 9888f +61 3 8699 1100

SydneyLevel 2, 68 Moncur StreetWoollahra NSW 2025 Australiat +61 2 9302 0200f +61 2 9302 0239

Postal AddressPO Box 1431Woollahra NSW 1350 Australiae [email protected] www.komosion.com