Do you want to give users the ability to upload multiple files to your WordPress contact forms?
Giving users the ability to upload multiple files in WordPress can make it so much easier to collect the information you need, directly through your forms.
Today, we’re going to be discussing how to create contact forms that allow file uploads.
Why use a file upload field on your WordPress forms?
There are many reasons why you may need to collect information in the form of important documents such as PDFs or images.
Giving users the ability to upload files easily means you are more likely to get the information you need. If users have to come away from the form and send you documents manually, they are much more likely to abandon the form and you'll end up with missing information.
Examples of forms that may need file uploads:
Job application forms – if you're advertising a job role, users can upload resumes or certificates to support their application.
Customer support – customers can attach supporting documents to give you extra information that will help you solve the problem.
User submitted content forms – with a file upload field, you can give users the ability to attach and submit an image or blog post they might want to share with your website. This is great for websites accepting guest blog posts.
With Formidable Forms, all of this is made easy. With our simple drag and drop form builder, you can easily accept images, documents, as well as audio and video files.
Ready to get started? You might want to take a look at our post on what to look for in a WordPress file upload form for some background information.
In the meantime, here is our step by step guide on how to include file uploads on your contact forms.
Step 1 – Create a new form in WordPress
If you haven’t already, you’ll need to install and activate the Formidable Forms Pro plugin.
Once you’ve got our plugin installed, simply click Formidable on the left, and then Add New. Then select the template you’d like to use. For example, you could choose the ‘Contact Us’ template or the 'Job Application Form'.
Formidable will then load up a simple contact form, with extra options on the right hand side, as shown below:
For more information on creating a new form, take a look at our documentation for a step by step guide.
Step 2 - Add the File Uploads field
As you can see from the screenshot above, there is a File Upload field that you can easily click to add to your forms. It's really as simple as adding one field, and then another if you wish to accept multiple file uploads in different sections of your form.
See below for a job application form example. This form accepts resume uploads as well as evidence of any certifications.
Step 3 - Customize your file upload fields
The next step is to simply rename each upload field according to what you want to show and add any descriptions to make things clearer for your users too.
Click Field Settings at the bottom of each section to see all the options you can customize for each field.
You can personalize each section by specifying the maximum file size of each upload, the file types accepted and whether this is a required section or not. This means you're less likely to get irrelevant files or large files that may slow your website down.
Read more: Client-side image resizing for faster form submission
While it's a simple click-to-add for multiple file uploads in different sections, you can accept multiple uploads in the same section here.
See the screenshot below, where you can simply check the box that says Multiple Files and 'allow multiple files to be uploaded to this field'.
Using the same example of job application forms, you might want to accept multiple file uploads if asking for evidence of qualifications. Users can then submit as many certificates or documents to support their answer, all within the same section.
Step 4 - Use conditional logic to improve your forms
Keep your forms clutter-free and show users only what they need to see by using conditional logic. Conditional logic enables you to show or hide fields, depending on what information a user has already submitted.
For example, if you ask the question "do you have any certificates/qualifications?" in a job application form, the next question can naturally follow on from that. If they answered 'yes', the next section to appear could be a multiple file upload field. If they answered 'no', then there's no need to show this field at all. This keeps the form clear and easy to fill in.
If you're unsure about what conditional logic is and why you could benefit from it, our recent blog post takes you through how to use conditional logic to build smarter forms.
Step 5 - Add your new form to your WordPress site
Once you've created your new form, you'll need to make sure it's visible on your website. Formidable allows you to add forms to your website easily once you've created them.
First, create a new post or a page in WordPress and click on Formidable at the top of your editor. You'll need to click 'Add Form' and then select your newly created form to add it to the page or post.
The next step is to publish your post or page and your contact form should appear on your website, ready for people to fill in. It should appear like the example below:
So, there you have it - a simple way to accept multiple file uploads to your website forms. We hope that this introduction to file uploads has helped you realize the potential of your WordPress forms.
With Formidable, we want to make it simple for you to build complex and custom forms with as many fields as you need to use.
With multiple file uploads in WordPress, you are free to create complex forms that collect all the data you need, not just some of it.
If you're not already using Formidable Forms, why not head over to our features page to see the many ways we can help your website get the results you want.
Leave a Reply