Creating A Customized Contact Form
The Empty Form section gives you full creative control and lets you design your form exactly how you want to collect information from the users of your App, it can include a wide range of fields including images if you want.
There are probably too many uses to list but here are a few to get you started:
- Contact form
- Application form
- Entry form
- Booking form
- Model release
- Contract for signature
- Order form
- Model Rep Profile form
- Session Client Details
- Request Form
If you don’t want your form to be visible at all times in your App you will either need to set the display type to Hidden or add it to a page section instead of the home screen. You will actually need a minimum of 2 page sections because whatever is added to the topmost page in an app also remains visible at all times. In the example below the title section with the Mission Statement has been added to the top page called Home and the request more information form is on the Contact Form page.
Once you have added a form section to your App click anywhere on the form in the visual display or click the settings cog next to the eform section to open the enhanced form settings menu.
Let’s take a closer look at the various fields you can add to forms and how to customize them.
Text Line Input
After you have added a form you can add new fields by clicking the + plus add field to form symbol on the top left. By default, new fields are set as Text Line input which is the most commonly used filed. To change the field type, click the drop-down arrow to the right of the field type box and choose from the drop-down list. There are 13 different field types to choose from.
The text line input field allows users to input a single line of text it is suitable for collecting information such as names, telephone numbers, or a single line of an address or anything else that can be entered in one line.
Some of the options you can set for fields are the same for different types of fields, others are naturally specific to certain types. The options for the text line input filed are:
Name: When you add a new field, it is given a consecutive numerical name starting with F like this F11. This is the internal name assigned to the field that will be used for the column headings for the CSV data extracts when viewed on the Form Data Tab or downloaded and in the emails you receive when a client submits the form. You can change this to something more meaningful for the information the field is intended to collect such a name.
Label: This is also automatically assigned according to the numeric name e.g. New Field 11. The label is optional and is displayed above the field on the form you can either clear the text or replace it with your own. This is useful for adding headings or brief instruction.
Placeholder: This allows you to add example text or further information that will be displayed greyed out on the form as a prompt to help users fill in the field.
Pre-Filled in Value: You can add a pre-filled in value that will be displayed in the filed on the form, for example, a currency symbol where the field is intended for a monetary value.
Validate: This option allows you to enter something called a regular expression that can be used to validate that the data entered matches the expected format, for example, a telephone number or date. It works in a similar way to the data format codes you may have used in spreadsheets. Click the ‘i’ next to validate to find out more about regular expressions. Just leave blank if not required.
Validate Message: When validation fails this is the message that will be displayed. If you have added a regular expression for the validate option enter the text message you wish to display here for example “please enter the date in the following format only 30 10 2017”.
User Help Text: You can add text here as instructions that will appear on the form to help the user to fill out the form properly.
Required Field: Click the box if this field must be completed.
Text Box Input
The Text Box input field is similar to the Text Line input but does not include the validate option and allows users to input multiple lines of text. You can define the number of lines the text box should have at the bottom of the Field menu.
When not set as a required field you can disable the optional prefix from being displayed on the form. A text box input field could be used to collect Any questions or other information.
The checkbox field allows you to create a list of options for users to select. They can select multiple options on the list you create by ticking the box next to the items they wish to choose on the form. Click Add Option to add an item to the list and type in the text to describe it. You can delete an item you no longer want on the form by clicking the trash can next to it. For example, this could be used for people to choose which areas of photography they want further information on.
The radio button field allows you to create a list of options that are mutually exclusive, the user can only select one item from the list. This is useful where you want people to make a definite choice. For example, it could be used for the user to select how they prefer to be contacted.
The select from drop-down field essentially performs the same task as the Radio button field in that it allows the user to only choose one item from the list. But this time they make their selection from a dropdown list.
This is useful if you have a long list or just want to keep the length of your form more manageable. In the example shown here, I have used it to ask when someone would like to schedule a photo shoot.
Text Output (Markdown)
The is one of the most powerful fields you can add to a form as it allows you to display a variety of different outputs on a form.
You can add a variety of text formatted exactly how you want using a combination of the toolbar options and markdown formatting. But it doesn’t stop there as you can also add a hyperlink, bullet point or numbered lists, HTML code, an image, a quote or a table. In fact, almost anything you want. Use it to create a contract, model release or terms and conditions for a booking form. Add a signature filed and you not only have the means to deliver them digitally to clients via an App but to also receive a signed copy back via email when they submit the form.
The mpa.modelRelease shared template that you can find in the Template Bazaar the new Model release section are both excellent examples of the text output field in use as shown below.
This is an example of how you can add an image in a form this could be your logo or some other design element. You could even add a number of images in separate text output fields if you want so people can choose from them.
Click the link below to find out more about how to add images to your forms.
Net Promoter Score
The net promoter score field allows you to add an NPS input, this is useful for customer satisfaction surveys.
The user is asked to choose a rating from 1 – 10 for something. Popular uses would be to rate the email communication, booking system or some other client experience.
Use the label text to ask the question and add the user help text to explain how the rating works in more detail as in the example shown on the right.
This allows you to add a conventional Likert scale for users to input their choice. Likert scales are mostly used in surveys. You can choose from 2 different Likert scales, satisfaction, agreement and Goodness. Again, you can use the label to define the question and add help text with instruction.
The signature field lets the user sign the form. Very useful for model releases, contracts application and booking forms or any form where you require the signature of the person submitting it or perhaps a parent if the form is being submitted by someone under 18 years of ages, such as a Senior rep application form. You can add a label, help text and set as a required field.
The email field is similar to a Text Line Input field, but it automatically validates that the input looks like a valid email address and is, therefore, the one to use if you want to collect emails.
It’s a good idea to add some user information to remind people to check they have entered their email correctly as the validation does not detect typos!
It’s a good idea to make an email field a required one. You have a few additional options to tick for this field.
Reply to email address: Normally, when form submission emails are sent to you, they will come from firstname.lastname@example.org and be recorded on the Form Data tab in the builder. Where you can download form data as a CVS file.
When this checkbox is ticked, they will come from the email address entered in this field by the person submitting the form. This means you can respond to the form submission email you receive using Reply, and it will automatically be addressed to the email submitted on the form.
Send reply email to this address: Tick this box if you have added a client reply email field to the form and it will be sent to the email address entered in this field.
Add email to mailing list: Tick this box to automatically add the email address entered to a MailChimp list you have associated with this Brand on the Brand Set up Tab and linked to this form above.
Send copy of form to this address: When ticked a copy of the submitted form will also be sent to the email entered in this field.
The image field Lets users upload an image to submit along with the form. This would be useful for an application form, submitting a photo of a receipt or other document or perhaps a photo contest entry. You can add a label, help text and choose whether to make this a required or optional field. All the user has to do is click on the Choose file button and select an image file that is less than 1mb in size.
This is a hidden field that is not displayed on the form. When the form is submitted, the names of any gallery images that have been liked by clicking the red heart icon, will be submitted along with the form. There is an example of this in the submit favorites templates that can be found in the Template Bazaar on the Template Tab.
Client Reply Email
This is a hidden field and not displayed on the form. When the form is submitted, the text you enter in this box is emailed to the user. This uses markdown syntax so you can create pretty emails.
The testimonial and survey templates found in the Template Bazaar both have an example of a client reply email field.
Important Things About Forms
There are few things you need to take into account about how Forms work:
- You can reorder fields in your form by drag and drop just click on the field you want to move and drag it to the position on the form you want and repeat for all section. Remember if you have made changes to your form you will need to republish the App in order for them to be applied.
- Forms work instantly when mobile devices are connected to the internet and form data is automatically saved on the device when no internet connection is available and synchronized with your MyPhotoApp account when an internet connection becomes available.
- The form data is sent to you via email and stored for 30 days on the MyPhotoApp Server. You can access the data from the form data tab where it can be downloaded as a CVS file.
- While apps continue to work if you stop subscribing to MyPhotoApp, forms are no longer emailed or stored on the server.
Email & List Settings
If you have set up a MailChimp account on the setup tab in the builder you can link the form to a MailChimp list and if you have also linked a Postmark email account you can choose to send the email from this instead of the default MyPhotoApp email option.
Click the links below to find out more about how this works.