Let customers upload an image, position it on a product canvas, and save the final design with the cart/order.

Thong Dang

DanhThong Print Design Upload adds a simple product customizer to WooCommerce products.
Features: 
* Enable/disable design upload per product. 
* Customer uploads an image on the product page. 
* The uploaded image is added as a movable/resizable layer on a canvas (Fabric.js). 
* The product image can be used as the canvas background. 
* NEW (v1.0.1): Clip mask support to restrict the editable design area. 
* Visual overlay frame to clearly indicate the allowed design region. 
* The final merged design is exported as PNG and stored with the cart item. 
* Design files can be displayed in the admin order screen (per order item). 
* Lightweight lightbox support for viewing uploaded images.
This plugin is designed for stores that sell personalized products (e.g., t-shirts, mugs, phone cases, posters).
<h3>Clip Mask (New in v1.0.1)</h3>
Starting from version 1.0.1, you can optionally upload a clipping mask image per product to limit where customers can place and preview their designs.
<ul>
<li>Recommended format: PNG</li>
<li>Transparent area = allowed design region</li>
<li>Opaque area = hidden / restricted region</li>
<li>The canvas preview and exported PNG respect the defined clipping boundaries</li>
</ul>
This helps ensure designs stay within printable areas and improves print accuracy.
<h4>Third-party libraries</h4>
This plugin bundles Fabric.js for the canvas editor functionality. 
Fabric.js is licensed under the MIT License. The Fabric.js license file is included in the plugin package.
<h3>Usage</h3>
<ol>
<li>Go to WooCommerce → Product Design Upload Settings (<code>wp-admin/admin.php?page=wcpdu-settings</code>) and enable the option to allow customers to upload designs.</li>
<li>Go to Products → Edit product.</li>
<li>Enable the design upload option for that product.</li>
<li>(Optional) Upload a Clipping Mask Image to restrict the editable area.</li>
<li>On the product page, click the “Customize” button.</li>
<li>Upload an image, move/scale it within the allowed area, then click “Apply”.</li>
<li>Add to cart. The merged PNG is saved and attached to the cart item and order item meta.</li>
</ol>

Alternatives to DanhThong Print Design Upload

Top alternatives