Dynamic Forms
Administrators can create any number of customizable dynamic forms to collect information from customers and other public users of the site. Possibly the most typical use is for a general "Contact Us" form, but many other kinds of forms are possible, including applications, surveys, etc.
Here is a list of the topics covered in this document:
Example: A Basic 'Contact Us' Form
To cover the most common example, here are the steps involved in enabling a typical 'Contact Us' form.
The system is initialized with an inactive Contact Us form. You can find it by visiting Site Content -> Forms. Click on the ID of the form to view the details.
On the Contact Us form details screen, review and, if desired, update the Description field - this text will be shown on the page to users who visit the form.
In addition, you may add more instructions in the Instructions field, which is displayed immediately above the Submit button for the form.
By default, the Contact Us form is configured to send out an email each time the form is submitted. You can disable this by setting the Notification field to none. Note: for these or any other email Notifications to work, you must define the Store Email Address setting under Settings -> Email Settings.
Form Responses are also stored in the administrator, so you can also retrieve them there. To view the Form Responses for the Contact Us form, use the three-dots menu and select Form Reponses.
Review the different input fields and prompts for the Contact Us form by clicking the three-dots menu and selecting Form Fields.
By default, the form asks the user for their name, email, phone, and message, but you can tweak the wording, remove one or more fields, make the fields required or not, and add additional fields (using the plus icon).
When you're ready to enable the form, back on the main Form details screen for the Contact Us form, turn on the Is Active field.
Now the form is active but there's still no link for it anywhere. You can easily add a link to the Contact Us form by visiting the Settings -> Header and Side Panel Settings screen.
To add a link to the global footer, add the term "contact" to the Footer Links setting. To add a link to the global header, add "contact" to the "Navigation Bar Links" setting.
The result should add the Contact Us link to the global header and footer, like so:
And here is what the default Contact Us form page looks like:
Note: by default the Contact Us form and all other dynamic forms will display a CAPTCHA test (I'm not a robot) to reduce the number of spam submissions.
Example: Supplier Application Form
Here is another example of a dynamic form. For this example, we'll be creating a form that asks potential suppliers to send us information about their products. Unlike the Contact Us form, we'll start from scratch creating this one.
To create a new form, click Site Content -> Forms, and then click the plus icon.
Fill out the form to add a new Form; give the form a Name and provide a Description. These fields will be shown to users on the form page. The Name will be the title of the page and the Description will be shown above the form fields.
For the Notification field, select the "Form Response Notification" option. This tells the system to automatically email each response that is submitted to the store's Store Email Address (defined under Settings -> Email Settings). You may create other, custom Notifications and Templates for this field under Operations -> Notifications, but the "Form Response Notification" usually works for most cases. If you don't want to receive any notifications when the form is submitted, leave the Notification field empty.
Click Add New Record to create the form, and then click "Edit the new record" to go to the details page for the new form.
Next we need to add fields to the form. Under the three-dots menu, select Form Fields.
Click the plus icon to add the first field. On the Add Form field, add all the values to create a "Your Name" field.
Note we're saying this field is required. The Code value must be any unique value for the field under this particular form.
Next, add an "Email" field. We'll make this one required also, and we will also set the Validation Type to "Email." This means the system will check to make sure the user enters a valid email address.
Note we have provided a value of 10 for the Form Field Order. This means this field will appear after the "Name" field we created earlier. The fields are displayed in order from the lowest Form Field Order value to the highest.
Lastly, we'll add a "Textarea" form field that asks the user to provide more information about their products.
Note we've added a Description to this field. It will appear immediately below the field so it's good for providing more details instructions on how to fill out the field.
With these fields created, visit the Form Page for the form by clicking the "View in Customer Interface" option under the three-dots menu of the main Form details screen.
Here's what the resulting form looks like:
Obviously, you might like to add additional fields, such as a phone number, address, organization name, etc. You can do by adding more Form Fields under the Form in the administrator.
When a user submits a form, it is saved as a Form Response under the Form in the administrator. To view all the responses for a given form, visit the form details screen and use the three-dots menu to select "Form Responses."
Under each form response, to view the responses to each individual field, select "Form Response Fields" under the three-dots menu.
With the Form Response Notification configured on the form, the following email will also be sent out immediately as each response is submitted:
