How to add an image upload button on Shopify takes one app and no custom code: install Mini: Photo Upload, turn it on in the Theme Editor’s App Embeds tab, and a file dropzone appears above the Add to Cart button within minutes. From there you can restrict file types, cap the file size, and require the upload before checkout.
In this post:
- What an image upload button actually does on a product page
- Method 1: turning it on via App Embeds
- Method 2: adding it as a block
- Restricting file type, size, and count
- Testing the button with a real test order
- Common mistake: enabling both methods at once
- FAQ
Quick disclosure: I am the founder of Minimate Apps, and Mini: Photo Upload, the app in the steps below, is one of ours. The two setup paths and the file-restriction settings covered here apply to how any Shopify upload app is configured, not just this one.
What an Image Upload Button Actually Does on a Product Page
An image upload button lets a customer attach a file, a photo, a design, a reference image, before they add a product to the cart, and that file travels with the order into Shopify Admin automatically. This matters most for stores selling personalized products: custom apparel, engraved items, printed art, or made-to-order goods where the merchant needs a customer-supplied file to fulfill the order correctly. Knowing how to add an image upload button on Shopify correctly from the start avoids re-doing the setup later, once App Embeds and Add Block turn out to behave differently.
It solves a similar problem to a text-based custom field, covered in 5 ways product customization can transform your store, except the customer supplies a file instead of typed input. If images are only part of what you need to collect, Shopify file upload: the complete guide covers documents, design files, and audio or video too.
How to Add an Image Upload Button on Shopify via App Embeds
Start by installing Mini: Photo Upload from the Shopify App Store. Once it’s installed, enable it on your product page through your theme editor, there are two ways to do this, and picking the right one depends on your theme:
| Method | Works On | Setup Location |
|---|---|---|
| App Embeds | Every theme | Theme Editor, App Embeds tab |
| Add Block | Online Store 2.0 themes only | Product page template, Add Block |
For App Embeds: go to Shopify Admin, Online Store, Themes, Customize. Click the App Embeds tab, toggle Mini: Photo Upload on, and click Save. This is how to add an image upload button on Shopify for the widest range of themes, since App Embeds does not depend on the newer Online Store 2.0 template system. Shopify’s own app embed documentation covers how embeds behave across different themes in more detail.
Method 2: Adding It as a Block (Online Store 2.0 Themes)
If your theme supports Online Store 2.0, you can place the button more precisely. In the theme editor, open the product page template, hover near the buy buttons, and click Add Block. Select the image upload app, drag it to the position you want, and click Save. Repeat for each product template where the upload should appear. This second path to how to add an image upload button on Shopify is worth using when App Embeds’ default position above Add to Cart is not where you want it.
Restricting File Type, Size, and Count Before You Go Live
Once the button is placed, open the field’s Rules and Settings section. You can allow specific formats (JPEG, PNG, GIF, WEBP, or broader file types), set a maximum file size in MB, and set a minimum and maximum file count if you want customers to upload more than one file. A custom error message can display if a customer tries to upload something outside those rules.
A search of the app’s own reviews page turns up consistent praise for how quickly setup goes and how responsive support is when a merchant requests a tweak, though we could not pin an exact name, store, and date to a single quote for this post. See the reviews directly at the link below.
Testing the Button With a Real Test Order
Open a product page where the field is active, upload a test image, and add the product to the cart. If the uploaded file is visible during checkout, the button is working. Once the order completes, the file link appears in the order details in Shopify Admin, under the line item. This test confirms how to add an image upload button on Shopify was set up correctly before real customers rely on it.
Common Mistake: Assuming the Upload Button Works With Every Bundling App
Mini: Photo Upload’s Bundling Function add-on charge option is not compatible with other cart-transform apps, including Shopify Bundles. If another bundling function is already registered in the store, the add-on charge will not merge into the product correctly, and the fix is to switch to the Regular Add-On Product method instead.
This is a real platform constraint tied to how Shopify’s Cart Transform API handles line item properties, not a bug in the app. Merchants running into the same conflict with Shopify Bundles have flagged it directly in Shopify’s own community forum.
For merchants who also want to charge extra for a personalization option elsewhere on the store, Shopify product add-ons: how they work covers the pricing side in more depth.
Frequently Asked Questions
How do I add an image upload button to a Shopify product page?
How to add an image upload button on Shopify comes down to two paths: install an upload app like Mini: Photo Upload, then turn it on through Theme Editor, App Embeds, or add it as a block on Online Store 2.0 themes. No custom code is required.
Does adding an upload button require custom code or a developer?
No. Both setup methods work through the app’s dashboard and the Shopify theme editor.
Can I make the image upload required before checkout?
Yes, the field’s Rules and Settings section includes a toggle to require the upload before a customer can add the product to their cart.
Does the upload button work on mobile devices?
Yes, customers can upload from their camera roll or take a new photo directly, and file restrictions apply the same way on mobile as on desktop.
Can I restrict which file types customers are allowed to upload?
Yes, the Rules and Settings section lets you allow specific image, document, or media formats and set a custom error message for anything outside that list.
Why is the upload button showing twice on my product page?
This happens when App Embeds and Add Block are both enabled for the same product template. Turn off one of the two methods so only one upload field renders.
