One of the most popular requests from the EverWeb community was to include the ability for customers to be able to upload files to the website’s host. The introduction of EverWeb 3.0 made this possible with the updated Contact Form Advanced widget and the new Contact Forms Enhanced Addon.
To begin with you will need the following:
- EverWeb 3.0 or higher
- Contact Forms Enhanced Addon
Purchasing & Setting Up Contact Forms Enhanced Addon
To use Contact Forms Enhanced Addon, add the Contact Form Advanced widget to the page, if you have not done so already, then go to the Widget Settings.
If you have not already purchased Contact Forms Enhanced Addon, go to the ‘Contact Forms Enhanced Add-ons’ dropdown menu in the Widget Settings and select the ‘Add Contact Forms Enhanced Features…’ option. In the dialog box that appears, click on the ‘Buy Now’ button and follow the instructions to complete your purchase.
After completing your purchase, you will receive three emails: the first confirms your order, the second confirms payment and the third informs you that the addon has been set up and is ready for use in the Contact Form Advanced widget.
To activate the Contact Forms Enhanced Addon go back to the form in your project file. Click on the ‘Contact Forms Enhanced Add-on’ field’s dropdown menu. You should see the addon in the menu e.g. you should see something similar to ‘Contact Forms Enhanced – 1GB (12345)’. If the addon has not been added to the menu, close the project file then reopen it and try again. If this does not resolve the problem, check that you are logged in to your EverWeb account using the EverWeb-> Preferences -> Account menu.
Once you have added the Contact Forms Enhanced addon, it is usually a good idea to name the form in the Contact Form Name (Online Management) field. This will help you easily identify and manage your form submissions especially if you have more than one form that uses the Contact Forms Enhanced Addon.
Setting Up File Uploads in Your Form
If you want to include a file upload feature to your form you can now do so. In the Form Submission Settings of your contact form, you will see the ‘Form Controls’ section. If you have just added the Contact Form Advanced widget to your page, you will see three default form controls listed: Name, Email and Message. You can add, edit or delete form controls as you wish.
Add a new Form Control for customer file uploads to your contact form using the Add button below the Form Control list. Name the field as you want e.g. ‘Upload File’. Press Enter when finished. The form control and label ‘Upload File’ are added to the contact form in the Editor Window.
Next, change the Control Type for the ‘Upload File’ form control from the default ‘Checkbox’ type. First, make sure that the ‘Upload File’ form control is still selected in the Form Controls list. Click on the ‘Control Type’ dropdown menu and select ‘File Upload’. The form will update again in the Editor Window. A ‘File Upload’ button and ‘no file selected’ text will be displayed.
If you have forgotten to add Contact Form Enhanced to the contact form, when you select the File Upload Control Type, this will be automatically added. If you have not purchased Contact Forms Enhanced, you will be asked if you would like to purchase it in order to use the file upload feature.
Publishing & Testing Your Form
Complete your contact form then publish your website. Test the form to make sure that everything works properly, including the file upload feature.
When testing file uploading, note that you can only upload files of less than 2MB. If you try to upload a file that is over 2MB you will receive a warning that the selected file cannot be uploaded. When a file is uploading, a progress indicator is displayed.
Once you have submitted your form, you will receive an email confirmation in the mailbox of the email address that you stipulated in the ‘Email Address to Send Form to’ field of the contact form.
The confirmation email includes the data that was completed in the submitted form as well as a notification of a file attachment.
By default, the email confirmation contains a link so you can login to your EverWeb Client Area to manage, search and export your form submission data and download the file that has been sent to you. The email also displays the amount of server space used by file uploads.
Downloading Uploaded Files
You can also access your form submissions by directly logging in to your EverWeb Client Area. On the Client Area home page you will see the ‘Contact Form Submissions’ section on the left of the window. Click on ‘View Form Submissions’ to access the form submission data.
Click on the ‘Please select your form to access its submissions’ dropdown menu. A list of your forms will be displayed. Highlight the form you want and then click on the ‘Select’ button.
You will see the forms that have been submitted displayed. Move the mouse so that it hovers over the list of form submissions then scroll the information displayed to the right so that the ‘Attachment’ field comes in to view.
Click on the the field heading ‘Attachment’ to sort the form submission list based on whether the form submission has a file attachment or not. Click on the file attachment icon (an I within a circle) to initiate the download of the attached file of the form submission that you want. The file will be downloaded to your computer’s Downloads folder.
Adding a file upload feature to your contact form only takes a few steps and EverWeb makes it easy to mange files that you receive from your customers!
If you have a question about this article, please let us know in the Comment Section. We’re always here to help!
EverWeb on Social Media
You can also find EverWeb on the following social media platforms: