Miva: Custom Drag and Drop Image Upload on Product Pages

Image Upload Feature

Estimated reading time: 4 minutes

Personalized products are more popular than ever, and that’s not changing any time soon. Typically, you have to trust that your shoppers will properly email their required image file to you in a timely manner and in the correct format. It can lead to stalls in production, and costly customer service time. Our solution is an easy image upload feature.

Our developers have created a feature that you can apply to your product pages as an attribute where it’s needed. It will give your customers the ability to upload an image on the spot, for easy and hassle-free personalization.

If you offer personalized products, then you will understand the frustration that comes along with requesting and confirming custom artwork from a client. 

This handy feature will allow shoppers to upload a logo or image of their choosing directly onto the product page. Shoppers can choose to drag and drop their chosen file from their device. They can also click and upload for a more traditional experience. This image upload feature supports touch devices such as phone and tablets as well as standard desktop computers, so it comes ready for your mobile-responsive site.

How It Works for the Shopper 

Once the image upload is complete, the system will display a customized message. Successfully uploaded files will prompt a confirmation message, while ineligible files or ones that didn’t load properly will trigger an error message. 

The uploaded image or logo, along with the customer’s file name, is displayed for visual confirmation. This helps to reassure the shopper that they’ve chosen the correct file and that it is indeed attached.  

If the user needs to, they can upload a different file to have it overwrite the original one. The image is then attached to the product as an attribute so files are not lost or accidentally switched. 

How It Works for You

Adding the image upload feature to any product is as easy as one click once you have this mod installed. By connecting the customization as a product attribute, you have the ability to pick and choose which products need the option. You also have full control of adding and removing it from your site. That means you don’t have to worry about additional developer time.

While setting up the feature, you can specify file type and size restrictions, as well as other security measures. By allowing you to tailor how the feature works on your store, you can make sure it fits seamlessly into your existing workflow in order to enhance it. 

Adding customized features like this to an existing store is a great way to streamline your workflow, save time and money, and improve overall customer shopping experience. Please contact us if you have any questions or are interested in adding the above modification to your Miva store.


We want to show you one of the cool things we have done for this customer. They wanted their clients to be able to upload graphics and other logos. 

Here’s one of the products where being able to supply your own graphics would be beneficial. 

I’m going to zip down to that section here and you can see that we have programmed in a section where the customers can easily do that. There’s a couple of ways to do it: you can drag and drop, you can also click and browse. 

You can see a nice preview of your picture gets shown, as well as verification that the file you chose is the file that is uploaded. 

Once this product is in the shopping cart you can see that it’s an attribute so it stays along with the order. And we have uploaded the file to a directory sorted by date and another string. 

So because it’s an attribute, and in this case the attribute template, it’s super simple to assign it to different products. Just go where you normally would and give it an assign. 

So please let us know if we can do this on your site. Or if you have any optimizations that you would like, please let us know.

Leave a Reply

Your email address will not be published. Required fields are marked *