How to Allow Customer File Uploads on Checkout with Shopify

Shopify does not support native customer file uploads on standard checkout out of the box. In practice, the best way to allow customer file uploads on checkout with Shopify is to either add a file upload field on the product page or cart so it carries through to the order, or use a dedicated Shopify app that handles uploads, validation, storage, and order linking for you.

I have worked with a lot of Shopify merchants selling personalised products, print-on-demand items, signage, embroidery, custom packaging, and made-to-order goods. In my experience building Shopify apps and helping stores troubleshoot theme issues, file uploads are one of the most misunderstood Shopify customisation requests because merchants often ask for a checkout upload field when what they actually need is a reliable pre-checkout upload workflow.

If you only remember one thing from this guide, make it this: most Shopify stores cannot simply add a native file upload box directly into checkout. For most merchants, the practical solution is to collect the file on the product page, cart page, or via an app that attaches the upload to the order.

Can you allow customer file uploads directly on Shopify checkout?

No, not natively for most stores. Shopify checkout is restricted, and direct checkout customisation depends heavily on your plan, your setup, and whether you are using approved extensibility methods or third-party apps.

This is where a lot of older tutorials become outdated. A few years ago, merchants often tried to hack uploads into checkout with theme code, but that was never a stable solution. In 2025 and 2026, Shopify is far stricter about checkout customisation, so the realistic options are:

• Collect the file before checkout on the product page
• Collect the file on the cart page
• Use a dedicated file upload app
• Use customer account or post-purchase forms if the upload can happen after the order

If you are on Shopify Plus and using checkout extensibility, there are more advanced possibilities through extensions. Even then, it is not as simple as dropping a file input into checkout.liquid, especially because checkout.liquid is deprecated for many use cases. Shopify's modern approach centres around approved extension frameworks rather than direct template edits.

What is the best way to allow customer file uploads on checkout with Shopify?

The best method for most merchants is an app. A good file upload app is more reliable than custom code, easier to maintain, and far less likely to break when your theme updates.

When I test stores that sell custom T-shirts, engraved gifts, printed banners, or artwork, the app route nearly always wins. You get file type restrictions, size limits, required fields, and uploads linked to the order without needing to patch together a fragile workaround.

That said, if you want a free lightweight option and your needs are simple, a product page file upload field using line item properties can still work well. I will show both approaches below.

Which Shopify apps are best for customer file uploads?

The best Shopify file upload apps are Uploadery, Upload-Lift, Upload Fields by UploadKit, and Uploadly. They are popular because they solve the messy parts of uploads: storage, validation, order association, and merchant usability.

Based on the latest data available, these are the main options worth considering:

In my experience, Uploadery is often the safest recommendation when merchants need a mature, established upload workflow. Upload-Lift is attractive when budget matters. UploadKit is useful if you want more storage and workflow flexibility. Uploadly is interesting for stores where customers are likely to upload straight from their phones or social accounts.

If your store also relies on custom order notes, internal processing, or production instructions, pairing file uploads with a structured order workflow matters. That is one reason merchants often combine upload tools with systems like NoteDesk for internal notes or process tracking, especially for made-to-order stores.

How do I add customer file uploads to a Shopify product page without an app?

You can add a file upload field to the product form using line item properties. This is the most common no-app method, and it is still useful if you only need a simple upload field on specific product pages.

This approach does not truly modify Shopify checkout. Instead, it adds the upload field before checkout, usually on the product page, and then passes the file through with the cart item so it appears on the order.

Important: always duplicate your theme before editing code. In Shopify admin, go to Online Store > Themes, click the three dots on your live theme, and choose Duplicate.

What code should I use for a Shopify file upload field?

A basic file upload input uses the properties[] naming pattern inside the product form. That lets Shopify treat it as a line item property attached to the cart item.

Here is the simple version:

<div class="product-form__item product-form__item--logo">
  <label for="custom_photo">Upload your file</label>
  <input
    id="custom_photo"
    class="product-form__input"
    name="properties[Artwork Upload]"
    type="file">
</div>

If you want the upload to be mandatory before the customer can add the item to cart, use this version:

<div class="product-form__item product-form__item--logo">
  <label for="custom_photo">Upload your file</label>
  <input
    id="custom_photo"
    class="product-form__input"
    name="properties[Artwork Upload]"
    type="file"
    required>
</div>

This is very similar to the original method in this article, and it still works in many themes when placed correctly inside the product form. The key is making sure the field sits inside the add-to-cart form, not outside it.

Where do I put the upload code in a Shopify theme?

You should place the code inside the product form, above the add to cart button. In most themes, that means editing the main product section or product form snippet rather than an old product.liquid template.

On older themes you might still see product.liquid. On Online Store 2.0 themes, you are more likely to find files like:

• sections/main-product.liquid
• snippets/product-form.liquid
• sections/featured-product.liquid

Search your theme code for type="submit", name="add", or the actual add to cart button markup. Then insert the upload field a few lines above the submit button, while keeping it inside the <form>.

If you are not comfortable editing Liquid, I would strongly suggest using an app instead. Theme structures vary a lot now, and what works in Dawn may not map neatly to a heavily customised premium theme.

Why is my Shopify file upload not working?

The most common reason is an AJAX cart or cart drawer. File uploads need a standard HTML form submission, and many modern Shopify themes use asynchronous add-to-cart behaviour that does not handle file inputs properly.

This is one of the biggest gotchas, and it catches merchants all the time. You add the code, test it, and the file seems to disappear. In many cases, the theme is using a slide cart, drawer cart, or AJAX add-to-cart flow that never submits the file in the way Shopify expects.

The original warning in this article is still absolutely relevant: file uploads often fail with popup carts or slide-out carts. If that happens, switch your theme to redirect to the cart page after add to cart, then test again.

Common reasons uploads fail include:

• The input is outside the product form
• The theme uses AJAX add to cart
• The field name is incorrect and not using properties[]
• The form is being replaced dynamically by JavaScript
• The app block or custom field is only added to one template but not the one in use
• The upload is required but hidden or blocked on mobile

If your store uses a cart drawer and you are actively optimising AOV, this creates a trade-off. Cart drawers are great for upsells, but they can interfere with uploads. If that sounds familiar, read How to Create Shopify Cart Drawer Upsells That Boost AOV and weigh the conversion benefit against the operational need for file collection.

How do I make the file upload required on Shopify?

Add the required attribute to the file input. This works for basic browser-side validation on product forms, although it is not as robust as app-based validation.

Here is the simplest version again:

<input
  id="custom_photo"
  class="product-form__input"
  name="properties[Artwork Upload]"
  type="file"
  required>

This will usually stop the customer adding the product to cart unless a file is selected. However, I do not consider this bulletproof for more complex stores. In my experience, theme scripts, quick-buy modals, variant pickers, and dynamic product forms can all interfere with native browser validation.

That is one reason apps tend to perform better for serious personalisation workflows. They usually give you better validation rules, file type restrictions, and clearer error messages.

Should you collect files on the product page, cart page, or after purchase?

The best place depends on your business model. Product page uploads are best for made-to-order goods, cart page uploads work when one file applies to the whole order, and post-purchase uploads are best when customers need more time.

If you sell custom products that cannot be fulfilled without a file, I usually recommend collecting it on the product page. If you sell something like a design service or a print consultation, collecting the file after purchase can sometimes improve conversion because it removes friction during buying.

For stores handling more complex customised orders, this also overlaps with internal ops. You may also want to read How to Track Customized Orders in Shopify: Workflows, Tags, and Automation Guide.

What are the limitations of the custom code approach?

The custom code method is free, but limited. It works best for simple stores and small file upload needs, but it is not the most robust option for growing merchants.

Here are the main limitations I see in real stores:

• No advanced file validation unless you add custom JavaScript
• No built-in image editing or cropping
• Theme compatibility issues with quick add and AJAX carts
• Harder maintenance after theme updates
• Limited merchant UX compared with dedicated apps
• No central dashboard for managing uploaded files

If you are already dealing with custom options, rush production, or bespoke workflows, the free method can become expensive in a different way: time. I have seen merchants spend hours debugging a free upload field when a £9 to £20 per month app would have solved the problem immediately.

Can Shopify Plus stores add file uploads at checkout?

Shopify Plus stores have more flexibility, but the answer is still not a simple yes. Modern checkout customisation relies on checkout extensibility and approved UI extension methods rather than old-school checkout template edits.

Shopify has introduced extension-based approaches, and developers are discussing file attachment patterns using components like DropZone in extension contexts. But for most merchants reading this article, the important point is this: checkout uploads are still an advanced build, not a default Shopify feature.

If you are on Plus and considering a checkout-level implementation, make sure you understand the technical and commercial trade-offs first. You may also want to read When to Upgrade Your Store to Shopify Plus before assuming Plus is the answer to this requirement.

For reference, Shopify's developer ecosystem increasingly points merchants towards extensibility rather than direct checkout editing. If you are exploring that route, review Shopify's official documentation and extension resources at shopify.dev.

How do I choose the right file upload setup for my store?

Choose based on order complexity, file size, and how essential the upload is to fulfilment. The right setup is the one that reduces failed orders and support tickets, not just the one with the lowest monthly cost.

Here is the framework I use when advising merchants:

1. If the upload is optional and simple, try a product page field.
2. If the upload is mandatory for fulfilment, use a dedicated app.
3. If customers often upload large files, choose an app with higher limits such as Uploadery.
4. If one file applies to the whole order, consider a cart page upload.
5. If customers need time to gather assets, collect files after purchase using an account form or follow-up flow.

There is also a conversion angle here. Every extra field on a product page can create friction, so you need to balance operational needs with sales performance. If you want to improve product page conversion while keeping customisation fields manageable, see How to Maximize Revenue from Your Shopify Product Pages.

What is my recommended setup for most Shopify stores?

For most stores, I recommend using an app and collecting the file before checkout. It is the most reliable, scalable, and support-friendly option.

In my experience building Shopify apps and reviewing merchant setups, the merchants who struggle most are usually trying to force a checkout-only solution for a problem that should be solved earlier in the customer journey. If the file is essential, ask for it on the product page. If the workflow is more complex, use a specialist app. If the upload can wait, move it post-purchase.

My practical recommendation looks like this:

• Use custom code if you want a free basic upload field and your theme uses standard form submission
• Use an app if the upload matters operationally or you want a polished experience
• Avoid relying on cart drawers for upload-heavy products unless you have tested thoroughly
• Test on mobile, not just desktop
• Place a real test order and confirm the file appears in admin, notifications, and fulfilment workflow

If you are also thinking about how customisation impacts AOV, upsells, and product page design, these guides may help:

• How to Upsell on Shopify in 2026
• How to Add a Rush Order or Production Option to Your Shopify Store
• How to Cross-Sell Matching Variants and Boost Your Shopify Store's AOV

How do I test Shopify file uploads properly before going live?

You should test the full journey from product page to order admin. A file upload field is only working if the customer can upload successfully and your team can actually access the file when fulfilling the order.

My recommended test checklist is:

1. Test on a duplicated theme first
2. Upload from desktop and mobile
3. Test valid and invalid file types
4. Test with your cart drawer enabled and disabled
5. Place a real test order
6. Check the order in Shopify admin
7. Confirm the fulfilment team can access the file
8. Check notification emails and any app dashboards

I would also recommend checking whether your upload flow affects site speed or causes JavaScript errors. If you are making multiple theme edits, keep an eye on performance and avoid bloated scripts. This is especially important if you are already tweaking your theme heavily. For more on that, read The Hidden Truth About Shopify Speed Optimization Scams.

Final thoughts on allowing customer file uploads on checkout with Shopify

The simplest accurate answer is that Shopify does not offer native file uploads at checkout for most merchants, but there are reliable workarounds. The strongest option is usually an app, while the cheapest option is a product page file input using line item properties.

The original code snippet in this article is still useful, and I have kept the core idea because it remains relevant. But the Shopify ecosystem has changed, themes are more dynamic, and checkout is more locked down than many older tutorials suggest. That is why a more realistic 2025 and 2026 strategy is to collect files before checkout, test thoroughly, and use apps when the workflow matters.

If you want the least hassle, start with Uploadery or Upload-Lift. If you want the cheapest route and are comfortable editing code, add a product page file field and make sure your store uses a standard cart flow rather than AJAX for those products.