WordPress Tutorials, Tips, and Resources to Help Grow Your Business
Are you looking for a way to create a contact form that allows users send you messages with file attachments? Well, we have a better solution for you. In this post, we’ll show you how to add a file upload feature to your WPForms contact forms and also have those files automatically uploaded to your Google Drive.
You don’t need any web design or programming skills to create this form. Thanks to the beginner-friendly drag and drop editor on WPForms, you can create this Google Drive upload form in a few simple steps.
Before we get to the fun part of this guide, let’s figure out why you should use a file upload form on your website.
Why Create a Google Drive Upload Form?
Whether you’re managing a small business or a WordPress blog, there are situations where users might want to send you files through your website’s contact form.
Having a contact form with a file upload feature will make that process much easier for both you and your users. But, why connect it to Google Drive?
Normally, when a user uploads file from a contact form it will get uploaded to your website’s server. So, for some reason, if your server files get corrupted or inaccessible, all those uploaded files will also disappear along with them. Not to mention that when lots of users start uploading files to your server, it will also take up your hosting space as well.
However, when you connect Google Drive with your contact form, it will also send a copy of those uploaded files to your Google Drive. That way, you will have copies of those uploaded files on both your server and on Google Drive. It will make things much easier for you to manage those files and you can even delete those files on your server to free up space.
Create The File Upload Form
Without further ado, let’s get started and create this awesome Google Drive upload form on your WordPress blog.
Creating the upload form is easy. If you prefer instructions in video format, watch the video above. Or, reading this guide for a more detailed step-by-step tutorial.
How To Integrate Google Drive Uploads
Now that we’ve created a gorgeous contact form with an upload feature, let’s see how we can connect Google Drive with this upload form so that a copy of the files uploaded via the form gets automatically sent to your cloud storage.
Note: This guide will only show you how to save your upload form file attachments into a Google Drive folder. If you also want to save your contact form entries such as the name, email, and message, check out this guide to learn how to connect a contact form with Google Sheets.
In order to connect Google Drive with WPForms, you’ll need the Zapier addon and a Zapier account.
Step 1: Go to WPForms » Addons. Scroll all the way down to find the Zapier addon. Then click Install and activate the addon.
Step 2: Go to WPForms » Settings » Integrations and copy your WPForms Zapier API key. You will need this to connect your Zapier account with WPForms.
Step 3: Login to your Zapier account. If you don’t have a Zapier account you can register an account for free. And click on Make A Zap button.
Step 4: Search for WPForms and select it as the trigger app.
Step 5: Choose New Form Entry as the trigger and Save.
Step 6: Then click on Connect An Account. This will open a new window. Enter your website address and the WPForms Zapier API key here. Then click Save and Continue when prompted.
Step 7: In the next step, select your upload form from the list of forms you’ve created. And click Continue.
Step 8: Now, Zapier will ask to test your form. Before doing that, you need to enter a test entry onto your form. Go to your WordPress dashboard » WPForms » All Forms and click Preview to show your form. And submit a test entry. Make sure to add a sample file attachment in this test message.
Step 9: After completing the test, go back to your Zapier account and click Fetch and Continue button to test the trigger you’ve just created. After the successful test, click Continue.
Now you can create an action for the Zapier trigger you’ve just created. Here’s how it’s done.
Step 1: In the list of Action Apps, search and find Google Drive.
Step 2: Choose Upload File as the Action. Then click Save and Continue.
Step 3: Now you need to connect your Google Account with Zapier. Click on Connect an Account and login to your Google Account. When prompted, Allow Zapier to access your Google Drive.
Step 4: In the Setup Template section, choose your default Google Drive and a folder to save your uploaded files. It’s best to create a new folder to save your contact form uploads for easier management.
Step 5: In the File option, choose File Upload which contains the file you’ve uploaded in the contact form test entry.
Step 6: You can leave the rest of the options blank. But, you can customize them if you like to automatically convert your uploaded files to Google Drive file formats or change the names. Once you’re done, click Continue.
Step 7: In the next step, Zapier will test your upload form. Click Send Test To Google Drive. Go to your Google Drive folder and see if you see a copy of the file you attached in your test form entry.
Step 8: If you see a file on the Google Drive, then your Zapier integration is successful. You can go ahead and click Finish to complete the Zap.
Step 9: Give your Zap a name and Turn it On.
That’s it! If you want, you can do another test form submission to see if it works.
Embed The Upload Form
Now, let’s see how to embed the upload form on your website.
Go to WPForms » All Forms. Find the upload form you’ve created and copy its Shortcode. Then you can paste this code onto a page, a post, or anywhere on your website to make the form appear.
There you go! Now your users can send you any kind of a file from your contact form.
Keep in mind that this method only sends a copy of the uploaded file to your Google Drive. The original file will get stored on your server. WordPress might also restrict some types of file uploads. You can fix that by following this guide.