Last Updated on by Dan S
Originally Published February 3, 2020.


A quick guide on how to allow customer file uploads on checkout with Shopify

Some of your customer orders may require a customer file upload when they checkout. This can be achieved by the following methods: adding some code to your product pages or using an app.

Important: Always backup your theme’s code file first.

You can do this by simply copying the contents and pasting them into notepad or a plain text editor. This way you have a copy in case it goes wrong.

Editing code

  1. You’ll need to navigate to your product.liquid file (or product template file in Shopify 2.0 themes) and search for type=”submit”
  2. The part of the page that appears will be the ‘add to cart‘ section
  3. You’ll want to add the following code to this section, a few lines above type=”submit”: </p><div class="product-form__item product-form__item--logo"><label for="custom_photo">Logo?</label> <input id="custom_photo" class="product-form__input" name="properties[Logo]" type="file" /></div><p>
    <div class="product-form__item product-form__item--logo"><label for="custom_photo">Logo?</label> <input id="custom_photo" class="product-form__input" name="properties[Logo]" type="file" /></div>

     

  4. If you want the customer file upload to always be required at checkout, you’ll need to add ‘required’ in the input tag, as per the below:<br /> <br /> </p><div class="product-form__item product-form__item--logo"><label for="custom_photo">Logo?</label> <input id="custom_photo" class="product-form__input" name="properties[Logo]" required="" type="file" /></div><p>
    <div class="product-form__item product-form__item--logo"><label for="custom_photo">Logo?</label> <input id="custom_photo" class="product-form__input" name="properties[Logo]" required="" type="file" /></div>

     

The above may not work for everyone. Given the theme, it may require passing the upload as cart line items so it attaches to the order.

Please note: file uploads will not work if your cart page uses a slide-out or popup cart (AJAX cart). File uploads require standard HTML form submission and cannot be sent via AJAX. If you test this code above and the file does not upload, you must switch to the ‘redirect to cart page’ option. This can be found in Customize Theme, then Cart Settings.

Using Apps for File Uploads

The best and most reliable solution in 2025 is to use a dedicated app that allows you to select field types as well as validation and other requirements. These apps properly handle file uploads, attach them to orders, and work seamlessly with modern Shopify themes. Popular options include:

  • Uploadery – Supports files up to 2GB with image editing and cropping features
  • UploadKit (File Uploads) – Offers Google Drive integration and post-purchase upload options
  • Uploadly (File Upload) – Features multi-source uploads from computer, mobile, social media, and cloud storage

These apps can assign upload fields on a per-product basis and properly attach files to orders without requiring custom code modifications.

Collect personalised information on a product page

If you have a specific product that requires the customer to input information or a personalisation, you can do this on your product pages. This can be done by using line item properties. These are custom form fields that can be added to your product pages using the format name="properties[Property Name]". Line item properties allow customers to choose or add personalised information about a product and then easily checkout, with the information appearing alongside the order in your Shopify dashboard.