How to Add File Uploads to Your Squarespace Contact Forms
Have you ever needed your site visitors to upload files directly through your contact form? Whether you're accepting job applications, hosting an art contest, or simply collecting documents, Squarespace has made this easier than ever with their built-in file upload feature. This is a game-changer, eliminating the need for clunky third-party integrations!
In this tutorial, I’ll walk you through how to add file uploads to your Squarespace contact forms.
Watch the video
Check out the YouTube video below. 👇🏼
Why Use File Uploads in Squarespace Contact Forms?
Adding a file upload option to your contact form opens up a world of possibilities for how your website can interact with users. Here are just a few examples of how you might use it:
Job Applications: Allow potential candidates to upload their resumes directly.
Art or Content Submissions: Perfect for contests where you need to collect digital files, like images or documents.
Document Collection: Get required forms or paperwork sent straight through your website.
Now, let’s get into the step-by-step guide.
Step-by-Step Guide to Adding File Uploads
Step 1: Add or Edit a Form Block
To start, you’ll need to add or edit a form block on your site. If you already have a contact form, great—just use that! If not, here’s how to add one:
Go to your page, enter “Edit” mode, and click the “Add Block” button to pick a new block.
Select “Form Block” and place it wherever you want on your page.
If you already have a contact form on the page, just click on it and hit the pencil icon to edit.
Step 2: Add the File Upload Field
Once you’re editing your form, click on the arrow beside “Edit Form Fields”. You will probably see the standard form fields like Name, Email, Subject, and Message. Here is where we are going to get the File Upload field added to your form:
Click “Add Field” and select “File Upload” from the options.
“File Upload” will populate below the other form fields in the window
Click the arrow beside “File Upload” to get the settings sorted
Step 3: Sort File Upload settings
Squarespace gives you the ability to change the labeling of this field on the form. It is probably best to just leave this labeled as “File Upload” unless you have a very specific reason however. Then you have some decisions to make:
You can choose to add a description such as “Upload Your Resume Here” or just leave the description field blank.
You can choose to make uploading a file a requirement for being able to submit the form.
You can choose to only allow certain file types or leave it open to all types of files.
Finally, you can choose the number of file uploads allowed up to a maximum of five.
Step 4: Accessing Uploaded Files
Once users start submitting files, you’ll need to know where to find them. Squarespace recently moved this feature, so here’s the easiest way to access the uploaded files:
After a file is uploaded and submitted, head to the “Form” section in the editor.
Click on “Storage” and then “Manage Submissions.”
You’ll be taken to the backend where you can view the form responses, including any uploaded files. You'll be able to download and manage the files directly from there.
Final Thoughts
Squarespace’s new file upload feature is a fantastic addition that saves you from relying on third-party tools. It’s versatile, easy to use, and integrates seamlessly with your existing contact forms.
📨 Join my mailing list to get Squarespace tips & tricks right in your inbox
Your Designer
I'm Bryan, a Squarespace web designer and founder of Abound Web Design. I have worked with all types of businesses and organizations from preschools to publishing companies to chiropractic clinics and everything in between. If you want to discuss a potential project, you can email me at bryan@aboundwebdesign or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.
