Last Updated on June 11, 2020 by Roshan Parihar
Do you want to make a file upload form in WordPress?
Forms are the best way of getting information from your audience. A simple contact form contains fields like name, email, and message to collect simple details. To collect more information, you can add a file upload field to your forms.
If you are using WordPress, it’s very easy for you to create a file upload forms using the WPForms plugin.
In this post, you will learn how to make a file upload form on your WordPress website.
Affiliate Disclosure: At Tutorialdeep, we believe in transparency for our users. In this blog, there are some referral links. If you signup with these links we will earn some commission with no extra cost to you. We recommend these links because these are our trusted brands.
What is File Upload Feature in WordPress?
A file upload feature is a way of allowing users to submit files like images, word docs, spreadsheets, and other media files. To reduce using papers offline, you can add a file upload feature to your website.
It is the user input field to attach files with the forms. You can allow users to submit single or multiple files in forms to collect more information at a time.
Follow the simple instructions given here to easily create your file upload form. After creating the form, you can add it to your website posts and pages to get attachments easily.
Reasons Behind Using File Upload Form in WordPress
There are many reasons behind creating file upload forms in WordPress. A few of them are given below with details.
Customer Support Forms: A customer support form requires to add a file upload field to get error screenshots, payment confirmation slips, and other information to easily resolve problems.
Registration Forms: To get personal information from users when someone registering to your website, you have to provide a file upload field. This additional information can include certificates and other additional files.
Job Application Forms: To accept job applications from users, you need to add a file upload field to collect resumes and other technical skill certificates.
Post Submission Forms: A post submission form contains the fields like post title, description, and categories to get guest posts. You can add a file upload field to get featured images and other images from guest authors.
You can easily make a file upload form with the step by step guide given here.
So, let’s get started.
How to Make a File Upload Form in WordPress Website
To create a file upload form for your WordPress website, you have to follow the steps given below.
Step 1 Install Best Contact Form Plugin For File Upload Feature
First of all, you have to find the best contact form plugin for WordPress to install. It should allow you to add a file upload field when creating a form.
When you search for the contact form plugin, you will get WPForms as a highly rated plugin in WordPress repository.
WPForms is the best contact form plugin as compared to any other plugin. You will find the plugin as the highest 5 star rated plugin as indicated in the below image.
You need to install and activate the WPForms plugin to start creating the file upload form in WordPress.
Step 2 Create A Simple Contact Form
After you have done installing the plugin, you have to open the menu option WPForms >> Add New.
A page will open where you have to select the form templates to create the simple contact form. Provide the name of the contact form and select the template as indicated in the image below.
You can also select and use the other templates to get predefined fields for your form.
The simple contact form template contains the form fields like name, last name, email, and message. This is the WPforms drag-n-drop editor to easily add the fields to your form.
You can easily add the form fields by dragging the field from left and drop it to the right side.
The above form contains no file upload field to get attachments. Follow the next step to add the file upload field to your contact form.
Step 3 Add File Upload Field to Form
Scroll down the fields given at the left-hand side box to get the ‘Fancy Fields’. This contains the file upload field that you have to add to the above-created contact form.
Take your mouse to the file upload field and drag-n-drop it to the contact form as showing in the image below.
The above image showing the file upload field added to the contact form.
Let’s make settings to properly configure the file upload field for your contact form.
Step 4 File Upload Field Settings
To properly configure the file upload field, you have to click it to get various setting options. After clicking, you will get the setting options as indicated in the image below.
There are various setting options in the form field whose details are given below. Make settings as per your requirement for the contact form.
Label: Enter the name of the file upload field to display in the form.
Allowed File Extensions: Enter the comma-separated file extensions to allow as attachments.
Max File Size: Limit the max size for uploading the attachments for your users. The default value for this is 128MB.
Max File Number: You can allow users to submit more than one files at a single time. Users can drag-n-drop more than one file at a time to attach with the form.
Required: Make the file attachment field required to get attachments from your users. This will not allow the user to submit a form without any attachment.
You can also make advanced settings for your file upload fields that contain the below-given options.
Style: Display different styling file upload fields to your form with various styling options.
Store File in WordPress Media Library: Allow users to upload the files to WordPress media library directly using the file upload contact form.
CSS Classes: Add a CSS class to change the design of the file upload field as per your requirement.
Step 5 Configure Contact Form Settings
After you have done with creating the form and adding the file upload field to it. You can now make form settings to get the required output from your forms.
Click the ‘Settings’ options to make form settings. There are three setting options in WPForms which are General, Notifications, and Confirmations.
General Form Settings
It can be useful to change the general settings for the created form. Go to Settings>>General option to get the general form settings as given in the image below.
The General settings of the form contains the options like Form Name, Description, CSS Class, submit button text, and Submit button processing text.
You will also get the options to enable AJAX form submissions. An AJAX form submission is useful when you want to submit the form without page refresh.
Notifications Settings
For this setting, go to Settings >> Notifications. By using this setting, you can change the default notifications to get when someone fill details and submit the form. You can change settings like the sender email address, email subject, from name, and email.
You will also get the setting options like reply-to, and message from users. The message contains the smart tags to display all form fields in the result.
Confirmations Settings
To make this setting, you have to visit Settings >> Confirmations to get various options. It can be used for the confirmation when users submitted the form. You can change the message type and add confirmation messages text content to display on submission.
It can also be configured to show a page on submission or redirect to other URLs.
Step 6 Embed Contact Form Using Shortcode
After you are done with creating form and properly make settings, you can embed the form to your website posts and pages using shortcodes. To embed the form, you have to click the ‘EMBED’ button given at the top-right corner of the screen. See the image below showing the indicated place to click.
You will get a popup where you can find the shortcode as given below for the created form. Just copy and paste the shortcode where you want to display the form with the file upload field.
The form now starts showing on the required posts and pages you have inserted the shortcode. Whenever the user uploads the file and submits the form, the files get uploaded to the WordPress media library.
Step 7 Check Uploaded files
If you want to check all the uploaded documents from the file upload form, you have to visit WPForms >> Entries menu option.
A page will open where you can find the list of all the form entries and uploaded documents. You can also check the documents uploaded date and type of file attached.
That’s all about making a file upload form in WordPress using the WPForms plugin.
Conclusion
You can now easily create a file upload form with the help of the WPForms plugin in WordPress. It comes with many predefined templates to create forms in minutes. You can take benefits of this contact form plugin to get attachments from users.
You May Also Like to Read
I hope this post helps you to easily make a file upload form on your WordPress website. If you have any queries regarding the tutorial given above, please comment below.
Also tell me, which plugin you are using to create contact forms in WordPress? do comment below.