Key takeaways
- Shopify does not have a native file upload field in its contact form.
- For product customization uploads (custom logo, design file), use Shopify’s line item properties with a file input.
- For contact form file uploads (proof of purchase, reference images), use a form app that supports file uploads.
- Hulk Form Builder and Jotform both support file uploads with cloud storage.
File uploads in Shopify serve two distinct use cases: uploads attached to product orders (like a custom logo for an engraved item), and uploads attached to contact form submissions (like a warranty claim photo). The right approach differs for each.
Use case 1 — File uploads for product customization
The most common reason Shopify merchants need file uploads: customers ordering personalized products need to submit their design file, logo, or reference image with the order.
The correct Shopify method: line item properties.
Line item properties let you attach custom data to a cart item, including file uploads. The uploaded file is stored by Shopify and linked to the order.
How to add a file upload line item property
Step 1 - Duplicate your theme and open the code editor.
Step 2 - Find your product form. This is usually in sections/main-product.liquid or snippets/product-form.liquid.
Step 3 - Inside the <form> tags, add a file input:
<div class="product-form__input">
<label for="file-upload">Upload your design file</label>
<input
type="file"
id="file-upload"
name="properties[Design File]"
accept=".jpg,.jpeg,.png,.pdf,.ai,.eps"
/>
</div>The name="properties[Design File]" format is how Shopify associates the field with the line item. “Design File” is the label that appears in the order admin.
Step 4 - Shopify handles the file storage and displays the uploaded file in the order details.
Limitation: Shopify’s line item property file upload works in the standard cart and checkout flow. It does not work with accelerated checkout buttons (Shop Pay, PayPal) that skip the normal cart.
Describing it to Fudge
Rather than editing Liquid files yourself, describe the customization to Fudge:
“Add a file upload field to my product pages for custom products. Label it ‘Upload your design or logo (JPG, PNG, PDF)’. Show it only on products tagged ‘custom’.”
Related: Customize Your Shopify Product Page.
Related: Add Conditional Logic to Shopify Forms.
Use case 2 — File uploads in contact forms
For contact forms where customers might submit proof of purchase, warranty photos, or reference images, Shopify’s native contact form doesn’t support file uploads at all.
Related: Add a Custom Contact Form in Shopify.
Options:
Form apps with file upload support
Hulk Form Builder — includes file upload as a field type. Free plan supports basic file uploads. Uploaded files are emailed to you or stored in the app’s dashboard.
Powerful Contact Form Builder — similar functionality, same developer.
Setup: Install the app → create a new form → drag a “File Upload” field into the form → configure allowed file types and size limits → embed the form on your contact page.
Third-party form tools
Typeform and JotForm both support file uploads natively. Files are stored in the platform’s cloud storage and accessible via the form submission dashboard. Embed these on your Shopify page as an iframe.
Google Forms — free, supports file uploads (stored in Google Drive), very basic design. Works but looks generic.
What types of file uploads are commonly needed?
Custom product stores:
- Print files (PDF, AI, EPS, SVG)
- Logo files (PNG, SVG, AI)
- Photos for personalization (JPG, PNG)
- Measurements or schematics (PDF)
Service-based Shopify stores:
- Warranty claim photos (JPG, PNG)
- Proof of purchase documents (PDF, JPG)
- Technical specifications (PDF, DOC)
B2B or wholesale stores:
- Business registration documents
- Trade licenses
Always specify accepted file types and maximum file size clearly. Standard limits: images up to 10MB, documents up to 5MB.
Custom file upload implementation
For stores that need a file upload experience that’s fully integrated with their store design — not embedded from a third-party form tool — a custom implementation using a cloud storage service is an option.
The approach: use an <input type="file"> in a custom form, upload the file to a cloud storage provider (AWS S3, Cloudinary, or a similar service) via a server-side endpoint, then pass the resulting URL as a hidden field in the form submission or as a line item property.
This is complex to build correctly (authentication, file size limits, security). It’s best handled by a developer or by describing the full requirement to Fudge:
“Build a contact form with a file upload field. Files should be uploaded to [storage service] and the submission should include the file URL. Limit uploads to images and PDFs under 10MB.”
Security considerations for file uploads
Any file upload field can be abused to submit malicious files. Always:
- Restrict accepted file types using the
acceptattribute on the input - Set a maximum file size and validate server-side
- Never execute uploaded files — store as static assets only
- Use a reputable form app or cloud storage service that includes its own security validation
FAQ
For line item property file uploads (custom product orders), Shopify caps individual files at 20MB. For uploads through form apps or external services, the limit depends on the tool - Hulk Form Builder and Jotform typically support 100MB+ on paid plans, while free tiers often cap at 10MB. Check your specific app's plan details.
Yes, but it requires custom implementation. Cleanest path: describe what you want to Fudge ("add a file upload field to the cart drawer for special instructions") and it edits the cart template with <input type="file" name="properties[…]"> so Shopify saves uploads as line item properties. Manual: edit the cart template yourself. For per-line-item uploads, use the product page approach in this guide.
No. Files attached as line item properties are stored by Shopify at no additional cost. They appear in the order details and remain accessible to merchants for the lifetime of the order. Form-app uploads usually count toward the app's storage tier instead.
Restrict the accept attribute to only the formats you can actually use - typically images (.jpg, .png, .svg) and design files (.pdf, .ai, .eps). Allowing .doc, .zip, or executables creates security and processing risk without benefit. The narrower the accept list, the lower the abuse surface.
Line item property files are stored by Shopify and linked to the order. Open the order in admin → click the line item → the file appears as a downloadable link in the line item properties. Files uploaded through form apps live in the app's dashboard or in your connected storage (Hulk's dashboard, Jotform's cloud, your S3 bucket).
Related: Add Custom JavaScript in Shopify.