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

by Courtney Robertson on Jun 8, 2016

Do you want to allow users to add file attachments to your contact form? Giving users the ability to upload a file in your WordPress forms can make it easier for you to collect the information you need. In this article, we will show you how to add file upload to your WordPress forms.

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

When Do You Need File Upload Forms

There are a lot of uses cases where you may want to allow users to upload a file through your contact form.

Some potential use cases are:

And I’m sure you can find tons of other use cases as well.

Whether you want users to upload a .doc file, .xls or .csv file, an image file, a PDF file, or even an audio / movie file, we’ll show you how you can add a file upload form that accepts both small and large files.

Note: For WordPress security reasons, the file types that can be uploaded are limited. Here’s how to allow additional file upload types.

Adding a File Upload Form in WordPress

The first thing you need to do is install and activate the WPForms plugin. Here’s a step by step guide on how to install a WordPress plugin.

Once you have activated the plugin, let’s go ahead and create a new form.

You can do this by going to WPForms » Add New.

On the next screen, you need enter your form name and select from one of our pre-built form templates or start with a blank form.  For this tutorial, we will begin with a blank form.

New Blank Form

In the form builder, simply drag & drop the fields you want from the left column.

We have chosen the Name, Email, Paragraph Text, and File Upload field. You can click on each field to customize the settings.

File Upload

To rearrange the fields, hover your mouse on the far right side and simply drag to reorder.

WordPress Contact Form File Upload

Once you are done customizing the field, click on the Save button to make sure that your changes are saved.

After this, you need to configure the form notification and confirmation settings.

File Upload Form Settings

You can configure the form settings by click on the Settings tab.

You’ll see the General Settings as well as Notification and Confirmation settings.

The general settings area is fairly self-explanatory, so we will skip to the notification settings.

When you click on the Notifications tab, you can modify the email notification that you will get when a user submits a form. The default settings sends the site admin an email every time someone submits a form. You can customize the settings as needed.

WPForms Email Notifications

Next is the Confirmation setting. This is what the user sees after they submit their form.

WordPress Document Upload Plugin Confirmation

You have the option to show them a thank you message, redirect them to a WordPress page, or redirect them to a completely different page.

How to Embed a File Upload Form

WPForms give you two different ways to embed your file upload form into your site.

When you’re done editing the form, click on the Embed button on the top right. It will show you a shortcode along with a video. You need to copy the shortcode provided.

After that go the Post or Page that you want to add the form to and simply paste the shortcode.

embed upload form

The second option is to click Add Form within the Post or Page editor. This will result in the shortcode inside the post as well.

Adding a file upload form to a WordPress post via a button

Simply publish the page to see your form live on the website.

Here’s what our form looked like on the default WordPress theme.

View Your File Upload Form

View the Uploaded Files in Form Entries

WPForms stores each form submission as an entry. To view the uploaded documents, you need to go to WPForms » Entries. From there select “View” to see the form entry.

View WPForms Entries

Now you can right click to save the uploaded document or click to view it in your browser. Using our Zapier addon, you could even automatically save all uploads to Google Drive, Dropbox, or other cloud storage services.

That’s all. We hope this article has helped you learn how to create a file upload form in WordPress. What are you waiting for? Get started with the most powerful WordPress forms plugin today.

If you like this article, then please follow us on Facebook and Twitter for more free WordPress tutorials.

Comments

    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 🙂

  1. 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.

  2. 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!

  3. 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 🙂

  4. 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 🙂

  5. 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 🙂

  6. 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 🙂

  7. 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! 🙂

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.

[i]
[i]