We need to add a simple <input type="file"> field to our contact form, for our customers to upload a photo.
I found some old forum posts stating this is not possible with core Shopify, and we need to use an external service or third-party app for that.
Is that still the case in 2020?
Solved! Go to the solution
I have encountered this problem before. Basically Shopify does not support file upload from a website.
The very easy fix is to use an app, this one I have used and is free to a limit
But I'm sure there are others. The form builder is easy to use, and its one ( long ) line to insert onto a webpage for your site.
Simple and solves your problem.
This is an accepted solution.
Figured out a more or less simple way of doing this, all that is needed is an external web server that can receive file uploads:
- Add an <input type="file" /> field to the Shopify contact form
- Add a hidden text field after the file input field, that will hold the URL to the uploaded file
- On change, use XMLHttpRequest to send the file from the field to an external web server. Unfortunately its not possible to add custom files to our Shopify webspace, so I had to use an external server, something like: https://example.com/file-upload.php
- In file-upload.php, handle the file upload and save the uploaded file on the external server
- Have file-upload.php respond with the full path to the uploaded file, for example: https://example.com/upload/file.png
- Add this full path to the hidden input field that was created earlier
- Optionally add an indication that the file was successfully uploaded
When the customer submits the form, the hidden input fields will contain the full URL to the file that was uploaded
I hope this basic write-up can help someone. If anybody needs more information just ping me here...