WPForms Blog

WordPress Tutorials, Tips, and Resources to Help Grow Your Business

File Upload Form for WordPress

How to Create a File Upload Form in WordPress

Last updated on Jun 29, 2018 by Lindsay Liedke

Do you want to allow users to add file attachments to your WordPress contact forms? Giving users the ability to upload files and media to your WordPress forms can make it easier for you to collect the information you need.

In this article, we’ll show you how to create a file upload form in WordPress.

If you don’t like the video, or need more instructions, please keep reading.

Why Use a File Upload Feature on Your WordPress Forms?

You might need to add a file upload feature to your WordPress forms so you can collect different types of files and media from site visitors as they submit their form to you.

This way, you’ll have all the information you need submitted at once, with no need to retrieve files from your site visitors at another time.

Here are some of the most common times you might want to allow users to upload a file through your contact form:

And this is just the beginning.

Luckily, WPForms makes it easy for your site visitors to upload the following file types to your contact forms:

  • Images like .png, .gif, and .jpg
  • Documents like .doc, .xls, .ppt, and .pdf
  • Audio like .wav, .mp3, and .mp4
  • Video like .mpg, .mov, and .wmv
Note: For WordPress security reasons, the file types that can be uploaded are limited. Here’s how to allow additional file upload types to your forms.

Now let’s see how to add the file upload feature to your WordPress contact form.

Step 1: Create a Simple Contact Form in WordPress

The first thing you’ll need to do is install and activate the WPForms plugin. For more details, see this step by step guide on how to install a plugin in WordPress.

Next, go to WPForms » Add New to create a new form.

On the setup screen, name your form and select the template you want to use, depending on the type of form you’re creating.

For our example, we’ll choose the Simple Contact Form template.

Simple Contact Form Template

WPForms will create a simple contact form.

Simple Contact Form

Here, you can add additional fields to your contact form by dragging them from the left hand panel to the right hand panel.

With the simple contact form template, you’ll already have the Name, Email, and Comment or Message form fields.

Click on any of the form fields to make changes. You can also click on a form field and drag it to rearrange the order on your contact form.

Step 2: Add the File Upload Feature

To let site visitors upload files to your newly created contact form, you’ll need to add the File Upload form field to your form.

Remember, you can do this to any WordPress form you create.

Just drag the File Upload form field, found under Fancy Fields, from the left hand panel of the Form Editor to the right hand panel.

Add File Upload Feature to WordPress Form

The new form field will look like this:

File Upload Form Field

You can click on the form field and change the:

  • Label. Label the form field so your site visitors know what it’s for.
  • Description. Add a description to your form field explaining specifics to users. For example, if you only want people to upload their resumes, tell them that.
  • Allowed File Extensions. If you want to restrict the types of files that can be uploaded to your WordPress form, put them here, each separated by a comma.
  • Max File Size. Specify, in megabytes, the max size file you’ll allow users to upload. If you leave this blank, WPForms will allow a max of 128MB.
  • Required. If you want to require users to upload a file before they can submit their form, select this checkbox.

By default, all files uploaded by users are stored in the WPForms folder inside the Uploads directory of your site.

To make things easier, you can also store these files in your WordPress Media Library by selecting the appropriate checkbox.

File Upload Form Field Customizations

Step 3: Enable Conditional Logic on Your File Upload Form

Lastly, you can enable smart conditional logic to create clutter free forms if you want.

With WPForms’ smart conditional logic, you can show or hide fields based on the options a user inputs. All you have to do is click on Enable conditional logic and customize the rules.

Conditional Logic

This makes the form look more organized and helps fight form fatigue, which can help boost form conversions. It also makes sure you only request a file upload from a user that wants to upload a file.

For help with this step, check out our helpful documentation on how to use conditional logic with WPForms.

Once you are done customizing your form, click Save.

Now you’re ready to configure your form’s settings.

Step 4: Configure Your File Upload Form Settings

To start, go to Settings » General.

File Upload Form General Settings

Here you can configure the following:

  • Form Name. Rename your form here if you want to.
  • Form Description. Give your form a description.
  • Submit Button Text. Customize the copy on the submit button.
  • Spam Prevention. Enable the anti-spam honeypot feature to prevent spambot submissions. This feature is automatically enabled on all WordPress forms. If you decide to use another form of spam prevention, unclick this option.
  • GDPR Enhancements. You can disable the storing of entry information and user details, such as IP addresses and user agents, in an effort to comply with GDPR requirements. In addition, check out our step by step instructions on how to add a GDPR agreement field to your simple contact form.

When you’re done, click Save.

Step 5: Configure Your File Upload Form’s Notifications

Notifications are a great way to send an email whenever a form is submitted on your website.

Notifications

In fact, unless you disable this feature, whenever someone submits a contact form on your site, you’ll get a notification about the submission, whether they have uploaded a file or not.

If you use smart tags, you can also send a notification to the user when they submit a form, letting them know you received it and will be in contact shortly. This assures site visitors their form has gone through properly, along with their file upload.

For help with this step, check out our documentation on how to set up form notifications in WordPress.

Adding to this, if you want to keep branding across your emails consistent, you can check out this guide on adding a custom header to your email template.

Custom Email Header

Note: Since file attachments can often hurt email deliverability, currently we don’t attach files in emails. For example, if an email provider only allows a maximum of 10MB attachment but the user uploads a file size higher than 10MB, the email won’t be delivered. Instead, we send the file uploads via email as links.

Notification Email Links

Step 6: Configure Your File Upload Form’s Confirmations

Form confirmations are messages that display to site visitors once they submit a form on your website. They let people know that their form has been processed, along with their file upload, and offer you the chance to let them know what the next steps are.

WPForms has three confirmation types to choose from:

  1. Message. This is the default confirmation type in WPForms. When a site visitor submits a form, a simple message confirmation will appear letting them know their form was processed. Look here for some great success messages to help boost customer happiness.
  2. Show Page. This confirmation type will take site visitors to a specific web page on your site thanking them for their form submission. For help doing this, check out our tutorial on redirecting customers to a thank you page. In addition, be sure to check out our article on creating effective Thank You pages for boosting customer loyalty.
  3. Go to URL (Redirect). This option is used when you want to send site visitors to a different website.

Let’s see how to set up a simple form confirmation in WPForms so you can customize the message site visitors will see when they submit a form on your site.

To start, click on the Confirmation tab in the Form Editor under Settings.

Next, select the type of confirmation type you’d like to create. For this example, we’ll select Message.

Form Confirmation Type

Then, customize the confirmation message to your liking and click Save when you’re done.

For help with other confirmation types, see out documentation on setting up form confirmations.

Now you’re ready to add your contact form to your website.

Step 7: Add Your File Upload Form to Your Website

After you’ve created your form, complete with the file upload feature, you need to add it to your WordPress website.

WPForms allows you to add your forms to many locations on your website, including your blog posts, pages, and even sidebar widgets.

Let’s take a look at the most common post/page embed option.

To start, create a new post or page in WordPress and then click on the Add Form button.

Next, select your contact form in the modal popup and click Add Form.

Add File Upload Form to WordPress

Then, publish your post or page so your contact form will appear on your website.

Final File Upload Form in WordPress

Step 8: View Uploaded Files in Form Entries

WPForms stores each form submission as an entry. To view uploaded files, go to WPForms » Entries.

From there, select the right form from the dropdown menu and click on View.

File Entries

Right click the file to save it or click to view it in your browser.

View Form Entry

Better yet, use our Zapier addon, to automatically save all file uploads to:

And there you have it! You now know how to create a file upload form in WordPress.

And if you want to allow site visitors to upload files directly to your website, be sure to check out our helpful guide on how to create a file upload widget in WordPress.

So, what are you waiting for? Get started with the most powerful WordPress forms plugin today.

And don’t forget, if you like this article, then please follow us on Facebook and Twitter.

Comments

  1. Thanks for reading this article – I hope you found it helpful.

    I wanted to let you know about our new WordPress survey plugin that allows you to build interactive polls and surveys within minutes. You also get best-in-class reporting, so you can make data-driven decisions.

    You can get it 100% free when you purchase WPForms Pro plan.

    Get Started with WPForms Today and see why over 1 million websites choose WPForms as their preferred online form builder.

    Syed Balkhi
    CEO of WPForms

    1. Samantha, no these methods do not work for WordPress.com because you cannot install a plugin on WordPress.com.

      See this comparison of WordPress.com vs WordPress.org

      Update: WordPress.com Business plans are now allowing plugins to be uploaded. So WPForms will now work for you if you’re using WordPress.com Business.

    1. Uploaded files are linked to in the email notifications. So when you view the notification, it will have a direct link to the file(s). However we don’t include the actual file as an attachment in the emails.

      Multiple file support is something that is on our radar and we hope to add in the future 🙂

  2. Is it possible to export forms with data fields and image attachments (jpg) to a spreadsheet, please? I need to do this form competition entries. Thanks.

  3. Hello, Can I add the File Upload field with the free version of WPForms, or do I need the pro version to do this. One more question. Is it possible to change the color of the contact form text? Many thanks!

  4. Hi,

    can I restrict the size of the files user can upload (without using the general WP size setting) and… I’m having a multiuser site… can I send the info wich user uploaded the file?

    1. Hi Andreas,

      While in the WPForms editor, you can restrict the file upload types and sizes. Click on the upload field in the right-hand preview panel. Then in the left column, see Max File Size. That will determine the file upload size for this form.

      Max File Upload Size

      To show which user uploaded which file, you can use a form notification with a smart tag. From your form editor, go to Settings » Notifications. Scroll to the bottom for the Message. You’ll see “Smart Tags” in the upper right corner of the field. You can use smart tags to show details like the User Name {user_display}, the User ID {user_id}, or even the User Email {user_email}. When the user submits a form, your email notification can show you what they uploaded and who it was that submitted the form.

      Show User Info

    1. Hi Nenmeet,

      We don’t have any integration available for WP-CRM. Sorry for any inconvenience!

      Have a good one 🙂

    1. Hi Koko,

      Currently only one file can be uploaded per File Upload field, though we do plan to build in the ability to upload multiple files to a single field in the future. However, you can include numerous File Upload fields within a single form.

      I hope this helps! Please feel free to reach out if you have additional questions about this or anything else 🙂

  5. Hi there, is it possible to use this plugin in conjunction with Thrive Themes’ landing pages? Thanks in advance.

    1. Hi Zane,

      We’re not aware of any theme that would prevent WPForms from working. As long as they allow the use of shortcodes, which our plugin requires to display forms, you should be good to go 🙂

  6. Hi there. I’m using the free version of the uploader and am noticing that recently, in Chrome, when I mouseover the “upload files” text, a yellow edit option appears with a message inside it “open visual shortcode editor in new window” and when clicked, attempts to open a pop-up window. It doesn’t happen in IE though. It did this before and after I updated the plugin. Is this something included in your program or is it coming from WordPress and am I the only one seeing this (because I am in ‘admin’ mode) or is it something everyone sees?

    1. Hi Michael,

      That’s not coming from our plugin, though it could be that another plugin on your site is inserting this. To first rule out an issue with your specific Chrome install, I’d suggest opening it on a different computer (still in Chrome, though).

      If you don’t see it there, you’ll know it’s limited to the Chrome browser on your computer/device. If you do still see it, I’d next start going through the plugins on your site (deactivate them one by one until the issue is gone). Troubleshooting in this way is tedious, but often very effective. If you’re able to do this on a staging (or not public copy) of your site, that’s ideal — if you’re unsure, it may be worth contacting your hosting provider to find out if that’s an option for you.

      Please feel welcome to contact us in support as well, we’d be happy to help 🙂

  7. Hi, Is it possible to add a field along with upload in the form, accepting the category for the image. Also, is it possible to use geotagging??

    1. Hi Andy,

      Great questions. WordPress doesn’t allow categories on images without customization, and so that’s not something that our plugin is currently designed to do. For geotaggin, though, we have a Geolocation addon available with our Pro or Ultimate license levels. This will collect location information like city, state, latitude, and longitude.

      If you have any other questions about this, please let us know!

      Thanks 🙂

  8. I need to use this form for uploads that will be going into a gallery. Is there a way to have each category (I’ll include a dropdown in my menu for the 159 categories) to save to a different directory on my ftp or google drive?

    1. Hi Jan,

      AI’ve been looking over the settings for a zap that does this to be sure, and the same settings (such as the one location in Google Drive to send uploaded files from a form) apply to every uploaded file for a form. So it appears the only way to do what you’re looking for would be to set up a few different forms, and set up a separate zap for each — that way, you could tell Zapier to send the uploaded files for each form to a different folder on your Google Drive.

      I hope that helps! If you have more questions about this, please get in touch 🙂

    1. Hi Paul,

      Entry data for WPForms is actually stored entirely in the WordPress database, rather than site files in FTP. We’ve got all the details on this, including how to locate the entry-related tables, in this tutorial.

      I hope that helps! 🙂

    1. Hi Yonas,

      By default, all uploaded files will be saved to your site’s WordPress files within /wp-content/uploads/wpforms, though our Zapier addon (available with the Pro license level or higher) can be used to also send uploaded files to some other locations, depending on what exactly you’re looking to do.

      If you’d like more details, please get in touch and we’d be happy to help 🙂

  9. Here is what I would like to do: Have a form where users can submit text and images. Then when the form is submitted I receive it as a draft post and the images submitted are automatically placed in a gallery. Then I approve it and the post is published with the gallery of images. And it would be nice if it was available as a widget to be placed in a sidebar. Can WPForms do this? Thanks

    1. Hi Bill,

      Our forms aren’t currently able to generate galleries of images, though I agree this would be super useful. I’ve added that to our feature request list to consider further.

      If you’d like to let users submit posts, though, this is possible with our Post Submissions addon. With this you can require approval before the post is published, let users submit content, and more.

      Also, our plugin includes a widget so you can easily add forms to a sidebar or other widget areas on your site.

      If you have any other questions or would like more details, please get in touch and our team will be happy to help! 🙂

  10. Our client is looking for a way for users to submit videos to her website. We have managed to get a few, but it seems like the majority of people are getting the “file size is too large” notification. Is there a way to increase the maximum file size above 64 MB?

    1. Hi Adam,

      We aren’t actually able to change the upper limits for file upload size, as this is set within the site’s server. So the best next step is to reach out to the site’s hosting provider to ask if they could increase that allowed max upload size.

      I hope that helps! 🙂

  11. Hello, pls am a schhol student was giving a project to be summited…am in need of a WordPress plugin where by teachers can input scores of student weekly and d scores of each course are added to each weekly and moved to each student portal…so that student see there weekly score and sum total of each course as they login with there registration number….

    OR

    A plugin where by students scorecalculation are done on excel sheet and then the plugin import this excel data and fill into each student portal…so student see there weekly score and sum total as they login to there portal.

    1. Hi Daniel,

      We don’t currently offer built in options to achieve what you’re looking for, so our plugin may not be the best fit for this project. But we appreciate the consideration!

      If you have questions about anything else, please let us know 🙂

  12. Can i create a wordpress website like woocommerce and upload file.
    I printer. And my client order and upload your file.

    1. Hi Khanagha,

      I apologize, however we’re not able to provide support for the custom code required to accomplish this.

      If you have any other questions, please feel welcome to get in touch 🙂

  13. Hi there! I’d like to have a user upload an image for an existing post and then I need to be able to approve the image via the dashboard so that the image appears on the post page. Is this something I can accomplish with WPForms?

    1. Hi Paul,

      I apologize, however we don’t currently have a way to approve uploaded files or to send images to an existing page or post. If you’re looking for any other specific features, please feel welcome to get in touch! We’d be happy to hear more about the use case for what you’ve described, as well, so we can add those details to our feature request list 🙂

  14. I am using the upload feature to do a project contest entry form with photo submission. I need to be able to download the submitted photos so they can be used on social media. Is this possible?

    1. Hi Peggy,

      Yes, you can absolutely download any files that have been uploaded to your form. To do this, you’ll need to open the individual entry and then click on the file name to open it. This will open the image in a new tab or window in your browser. Then you’ll need to right-click on the image and choose “Save Image As” (here’s a screenshot example). This may look slightly different depending on your browser or Windows/Mac but the option will have a similar name in each.

      Then once the file is saved to your computer, you can easily upload it to any social media services.

      I hope this helps! If you have any additional questions, please know that as a paid license holder you have access to our private email support. This is the best way to get the fastest and most in-depth support for all of your questions 🙂

  15. I have a form for users to contribute content on my site. Is there way to customize the form so that users can format what they contribute?

    Also, is there a way to include a format toolbar on any of the form fields so that users can add formatting to their submission and/or add a link to what they are submitting?

    Thanks!

    1. Hi Tammy,

      We don’t currently have a way for users to submit formatted text, but I agree this would be super useful. This (as well as some editor options as they fill out the form) are definitely on our feature request list to consider adding in the future 🙂

  16. i want to make a website where people can upload and download pdf or word files for a school, if wpforms isn’t capable of doing it, can you tell me what CMS or wordpress plugin should i use? Thanks.

    1. Hi Kim,

      Sure, you can definitely use WordPress, and WPForms as well, to provide visitors with downloadable files. For instructions on how to create a PDF download link in WordPress, I’d recommend this tutorial from WPBeginner. The WPBeginner site is a great resource for all WordPress questions you might have.

      And if you’d like to require your visitors to fill out a form before receiving the download link, here’s an example of how you could use WPForms for that.

      I hope this helps! And if you have any additional questions about WPForms, please get in touch. We’d be happy to help 🙂

  17. Please can this multimedia uploading work on my blog site, that is if I paste the shortcode on my blog site.

  18. I read in an earlier post in 2016 that you didn’t have the ability to accommodate multiple file uploads. Just one file upload. Is that still the case?

    Ultimately, we would like to take the uploaded files and information populated from your forms to populate our CRM. Would this transfer be possible if I have a developer facilitate a script to do so?

    1. Hi Andy,

      We don’t currently have a way to upload multiple files to a single field (though this is on our feature request list for consideration) — however, users can absolutely upload multiple files within a single form. Here’s our tutorial with more details.

      Also it should be possible to upload your files to a secondary location. As examples, you could check out our tutorials on using Zapier to upload files to Dropbox or Google Drive.

      I hope this helps! If you have additional questions, please get in touch and we’ll be happy to assist 🙂

  19. Hi,

    Is it possible to:-

    1. Auto-capture user’s information in the form?(user must register and login) At least we need username and date/time of submission to be auto-captured.

    2. Create drop-down list for users to choose from? If yes, how about nested drop-down? (e.g after choosing the country, states will be listed).

    Thanks!

    1. Hi Ricky,

      Sure so depending on what information you’d like to collect, and which addons you have access to, there’s a bunch of different kinds of information you could auto-capture. For details, I’d suggest checking out our articles on unlocking hidden customer data and our doc on Smart Tags (which can pull a wide variety of info).

      We don’t have a way to create a nested dropdown, however you could create a similar effect with conditional logic. So for example, the first dropdown could include a list of countries and then a second dropdown (with a states list) could appear based on the country they select. For more details on how to accomplish this, please see our docs on conditional logic (included with all paid licenses) and our bulk add tool.

      I hope this helps! If you have any additional questions about this, please get in touch 🙂

  20. Hi,

    When creating a WPform with an upload file field – I need to get the data moved another software.
    A WPform integrated with Salesforce or Zoho CRM that will create a new record in the CRM with all the data from the form, including the files.
    I’m sure I could make a Zapier Zap for the connection, but not sure if the files also would be pulled over.

    Any help is welcome 🙂

    Thanks in advance.

    1. Hi Stef,

      Great question. I haven’t tried either of these specific integrations myself, but in case it helps:

      1) Zapier, as you mentioned, can be used to connect your WPForms to Salesforce and/or Zoho (those links will take you to articles with more details. To access our Zapier addon, you’d need a Pro license or higher.

      2) Zapier is able to accept uploaded files from your form, and to send copies to other services (we have lot of users who do this with Google Drive or Dropbox). To find out if/how to use this same functionality within these other integrations, I’d suggest reaching out to Zapier’s team.

      I hope this helps! If you have any additional questions about our Zapier addon, please get in touch 🙂

  21. Thanks for this article but it doesn’t work with fileupload validation in my site [URL removed]. its always get uploaded doesn’t matter file uploaded or not . plz help me.

  22. Hi all,
    I would like to know if and how I can create an auto confirmation message for a file upload form that will either send the uploaded file to the user again for verification or that will offer the user a link he/she can click to download the file they just uploaded.
    I think html code would probably be best but you’ll know best.
    Thank you!

    1. Hi Julia,

      Sure, our default notification emails would actually include a link like you’re describing. This is because, by default, all form notification emails include our `{all_fields}` Smart Tag which displays all of the information entered/selected by the user in the form.

      Or if you’d rather not use the `{all_fields}` option, you can set up a bit of HTML with a Smart Tag to generate a link to the uploaded file(s) as well. In order for us to better demonstrate this, could you please get in touch with our support team when you have a chance?

      Thanks! 🙂

  23. How to add preview of image uploaded ? Like if a user uploads photo, there should be a preview available for that photo. This is very important.
    Please let me know how to do it.

    1. Hi Hitendra – I apologize as we don’t currently have a way to do this. But I’ve added it to our feature request list for possible consideration in the future. We appreciate the suggestion!

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.