Here are the steps to follow to create a file upload in WordPress

Step 1: 

Create your file upload form in WordPress

For wordpress form with file Upload All you have to do is first install and activate the WPForms plugin. Unlike the Google Form upload file feature, WPForms allows you to not only create pages, but also add file uploads anywhere on your site. For more information on how to install this, see this step by step guide on how to install a plugin in WordPress.

Next, go to your WordPress Dashboard, click WPForms »Add New in the left-hand panel to create the new form and specify the name you want.

Next, go to the Additional Templates section, type “File Upload Form”, click on it and open the template.

Make sure you have already enabled Form Templates Pack Addon to search this form.

Now, WPForms will expand the pre-built file upload form, drag and drop and display the builder.

You can add additional fields to your contacts by dragging them here. Eg. you can add your payment field in file upload forms if you need a payment.

you already have the name, email, phone, file upload and additional comments fields with the file upload form template

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

You can add a file upload field to any WordPress form you create. By using Fancy Fields field Drag the File Upload Form field from the left hand panel of the form editor to the right hand panel.

Click the File Upload field and change this:

Label 

Name the form field so that your site visitors know what it is.

Description 

Add a description that explains the details to the users. For example, if you want people to upload only one image, tell them so.

Allowed file extensions 

If you want to control the file types that can be uploaded to your WordPress form, place them here, each separated by commas

Maximum file size 

In megabytes, specify the maximum file size that users are allowed to upload. If this is left blank, WPForms will be the default size limit allowed by your web host. If you want to increase it, check out this tutorial on how to increase the maximum file upload size in WordPress.

Requirement 

If you want users to upload a file before submitting their form, select this checkbox.

Style – Default modern style (recommended) and classic style (we will cover in depth in the next step)

where these file uploads are stored?

By default, all files uploaded by users are stored in the WPForms folder in your site’s uploads directory. To make things easier, you can save these files to your WordPress media library by selecting the Store field in the WordPress Media Library checkbox under Advanced Options.

Step 2:

Switch to the classic file upload field (optional case)

This step is optional and generally not recommended. But if you want to change the file upload field style from the default modern style to the classic style with the ‘Choose Now’ button, go to Advanced Options style and click on drop down to select classic.

Switching to the classic style may be a good choice:

You or your users prefer the ‘Button’ style file upload field

You prefer a very small file upload field ( accept 1 file)

Note that the classic file upload style only accepts 1 upload per field. If you are using the classic style, you will need to add another file upload field to accept multiple uploads in your form.

To show that your form is cluttered, you must enable conditional logic in the First Classic File Upload field before adding other fields. That way, those additional file upload fields will not be displayed on your form unless the user needs them.

Each classic style of file upload field allows users to upload only one file. To learn how to add multiple file uploads with the classic style upload field type, read on. If a file upload field works for you, you can skip the next step.

To enable conditional logic in the classic style field upload field, drag a drop-down field to your form from the left-hand panel above the file upload field.

Eg. Now click on the drop-down field to see the field options in the left panel and edit the drop-down field label to say the number of files to upload and the options that say 1, 2, and 3

After that, click on the File Upload field and in the Options, scroll down and expand the Conditions tab in the left hand panel. Then, select the checkmark to enable conditional logic.

Customize the conditional logic of the file upload field as shown in the screenshot below:

Note that new fields are added by clicking the Add New Groups button, which uses OR logic. If you need more information about using OR logic, read our guide on how to use and conditional logic.

The next step is to copy this file to the upload field.

In your form, click the Copy icon to the right of the File Upload field.

In the left-hand panel, change the label of the New File Upload field to upload your second file.

Now configure the conditional logic for this new field as shown in the screenshot below. The only change from the step above is that we removed the first action that says the number of files to upload is one.

Now, copy the second file upload field by clicking the icon and changing the label to upload your third file.

Configure the conditional logic field as well as the screenshot below. We only have the last field that says the number of files to upload is three.

When you are done customizing your form, click Save in the upper right corner of your screen. You have added multiple file upload fields to your form.

As you can see, in most cases, you will want to use a modern style to accept multiple file uploads.

So now that your form has the correct file upload fields (it can be 1 or more), you are ready to configure your form settings.

Step 3: 

File upload form settings – Customization 

To get started, go to Settings » General.

Here you can configure the following:

Form Name/Change the name of your form here if you wish.

Form Description/Explain your form.

Button Submit Text/Customize the copy on the Submit button.

Spam prevention/Stop spamming the anti-spam feature or contact form with Google reCAPTCHA. The anti-spam checkbox will automatically check all new forms.

Ajax Forms/Enable Ajax Multi-Upload without WordPress page reload.

GDPR Improvements/Disables the storage of login information and user details such as IP addresses and user agents, in accordance with GDPR requirements. Check out our step-by-step instructions on how to add a GDPR contract field to your simple contact form.

Click Save after you have done.

Step 4:

Configure notifications for your form

Notifications are a great way when someone submits one of your file upload forms.

Also, if the notification feature is not disabled, you will receive an email notification whenever someone on your site submits a form.

To receive an email message when someone fills out your form, you need to set up form notifications in WordPress and provide your email address.

Also, if you use smart tags, you can send a personalized notification to your site visitors upon completion of your form. This ensures that users get their form up and running with their file upload.

To learn more about this, check out our step by step guide on how to send multiple form notifications in WordPress.

Additionally, you have the option to easily stamp your notification emails by adding any image of your choice in your logo or custom caption image area. The logo / image you selected will be displayed on top of email notifications such as the WPForms logo below.

Note: WPForms will not link your user’s files to notification emails, as file links can often affect email distribution. Instead, we send file uploads via email as attachments.

Step 5: 

Configure your file upload form configuration

Form Confirmations Ways to take action (automatically) as soon as your user submits information on your form. For additional help with this step, see our tutorial on how to set up form validations.

There are 3 types of validations in WPForms:

Message/This is the default confirmation type that appears after someone submits your form, which is customizable. Check out our tips on ways to customize your confirmation message to increase the happiness of your site visitors.

Display Page/Automatically send users to any post or page on your site, just like the Thanksgiving page

Redirect/Useful if you want to redirect a user to another website or special URL for more complex development.

So let’s see how to set up a simple form validation in WPForms so that you can customize the success news site that visitors see when they submit a form on your site.

To get started, click the Confirm tab in the Form Editor under Settings.

Next, select the confirmation type which you want to create. For this example, we will select the message.

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

Now you are ready to add your form to your website.

Step 6: 

File upload form to your website – Add it

Add it to your WordPress site after you creating your form

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

So let’s look at the most common placement option: page / post embedding.

To get started, create a new page or post in WordPress or go to an existing update setting. After that, click on the first module (the blank area below your page title) and click on the WPForms Add icon.

Now, the WPForms widget will appear within your module. Click the WPForms drop-down and select the form you have already created that you want to insert on your page. So select your file upload form.

 Your form will appear on your website when you click the publish/update button on your screen.

Step 7: 

View your files

WPForms saves each form submission as an entry. To view uploaded files, go to WPForms Inputs.

From there, select the appropriate form from the drop-down menu and click Display.

Click on the file to download/view it in your browser.

Previous post Small Business SEO Tips and Checklists
Next post Increase website speed using Cache Plugins in WordPress

Leave a Reply

Your email address will not be published. Required fields are marked *