For stores selling custom or personalized products, giving customers a way to attach their files directly within the ordering process is one of those things that makes a bigger operational difference than it might seem on paper.
The WooCommerce upload file plugin by Extendons handles all of this, and this guide is going to walk you through setting it up properly across your product, cart, and checkout pages.
Getting the Plugin Installed and Ready
Before anything else, the plugin needs to be on your WordPress installation and activated. Here is how to do that:
- Purchase the File Uploader for WooCommerce plugin and download the .zip file from your WooCommerce account
- In your WordPress admin panel, go to Plugins > Add New and click Upload Plugin
- Select the .zip file and click Install Now
- Once installation is complete, click Activate Plugin
- Navigate to WooCommerce > Settings > File Uploader, where everything is configured
Inside the File Uploader settings, you will find three tabs: Add Rule, Manage Rule, and Recaptcha Settings. The rule system is the foundation of how the whole plugin works, so understanding it properly before anything else is the right way to approach the setup.
Understanding How the Rule System Works
Everything in this plugin is built around rules, and a rule is basically a complete set of instructions that tells the plugin where to show the upload button, what files to accept, how to price the upload, and which products, categories, or user roles it applies to.
You can create multiple rules for different scenarios, so a rule for custom printed products can have completely different settings from a rule for personalized gift items, and they can both run simultaneously without interfering with each other.
All existing rules are visible and manageable under the Manage Rule tab, where you can edit, enable, disable, or delete any rule at any time without affecting the others.
Creating Your First Upload Rule
Go to WooCommerce > Settings > File Uploader > Add Rule and work through the settings here carefully because this is where the entire WooCommerce upload file experience gets defined.
Basic Rule Settings:
- Enable or Disable: Make sure this is set to enabled before saving anything else, otherwise the rule will not be active on the frontend
- Rule Name: Give the rule a name that clearly identifies what it is for, especially if you plan to create multiple rules for different product types
Main Upload Settings:
- Label: This is the text that appears above the upload button on the frontend, so something clear and instructional like “Upload Your Design File” works better than a generic label
- Upload File Button Text: Set the actual text on the button itself
- Background Color and Text Color: Style the button to match your store’s existing design so it feels like a natural part of the page rather than something added on
- Allowed Extension: Enter the file formats you will accept, for example, jpg, png, pdf, ai, svg, eps. Only the formats you list here will be accepted; anything else will be blocked at the upload stage
- Maximum Upload Size: Set the largest file size you will accept in MB or KB. Keep your hosting server’s upload limit in mind when setting this
- Maximum File Upload: Define how many files a customer can attach within this rule in a single upload session
- Price: If you charge for file uploads, set the price here
- Discount Type and Discount Price: Set a fixed or percentage discount on the upload fee if applicable
- Price Per File Upload: Enable this if you want to charge per individual file rather than a flat rate
- Apply Fee to Item Subtotal: Enable this instead if you want a single flat fee applied once per order, regardless of how many files are uploaded
- Customer Notes: Enable this to let customers attach a written note alongside their file. Check the Required box if the note is mandatory for your production process
- Customer Notes Label: Customize the label that appears above the notes field
- Allow Upload Modification: Check this to allow customers to replace or update their files after submission, which is essential for any store that uses the approval and rejection workflow
- Description: Add a short description that appears inside the upload popup, giving customers any instructions they need before uploading
Once these main settings are configured, you will also see an Add More button which lets you create additional upload buttons within the same rule if a particular product or order type requires customers to submit multiple different types of files separately.
Setting Up Restrictions for the Upload Rule
Below the main upload settings are the restriction options and these are worth spending proper time on because they control who sees the upload button and where, which directly affects how relevant the WooCommerce upload file experience feels to each customer.
Product and Category Restrictions:
You can restrict the upload button to specific products or specific product categories so that it only appears when a relevant product is in the cart. This means customers buying standard non-customizable products will never see the upload option, while customers buying custom items will see it automatically without any extra steps.
To set this up, select either Specific Products or Specific Categories from the restriction dropdown and then use the multiselect box to choose the products or categories this rule should apply to.
User Role Restrictions:
You can also limit the upload button to specific user roles so that only certain types of customers see it. For example, you might want to show the upload option to registered customers and subscribers but not to guests, or you might have a wholesale role that has different upload requirements from regular retail buyers.
Select the relevant user roles from the dropdown, and the upload button will only appear for customers who match those roles when they are logged in.
Displaying the Upload Button on the Product Page
The product page is the most natural place for most stores to show the WooCommerce file upload option because it is where the customer is already making decisions about what they are buying and what customization they want.
When setting up or editing a rule, find the Display On setting and check the Product Page option. Once saved, the upload button will appear on the product page for any product that falls within the product or category restrictions you defined in the rule.
On the product page the customer will see the upload button with the label and description you configured, they can click it to open the upload popup, select their file or drag and drop it into the upload area, attach a note if the notes field is enabled, preview what they have uploaded, and delete or replace the file before adding the product to the cart.
The drag and drop option is worth enabling because it makes the upload process considerably more intuitive, especially for customers who are less comfortable navigating through folder structures to find and select a file manually.
Displaying the Upload Button on the Cart Page
The cart page upload option serves a slightly different purpose from the product page one. Some customers add products to their cart before they have their files ready, or they might want to review their cart contents before deciding which file to attach to which item.
In the Display On setting, check either Cart Page or Cart Page Alongside Cart Items, depending on where you want the upload button to appear within the cart layout.
The Cart Page option places the upload button in a general position on the cart page, while Cart Page Alongside Cart Items places it directly next to the relevant product in the cart, which is the more intuitive placement for stores where different items in the same cart might require different files.
Customers interacting with the WooCommerce file upload checkout experience at the cart stage can upload their file, preview it, attach a note, and replace it if needed before they proceed to checkout, which means by the time they hit the checkout page, everything is already in order.
Displaying the Upload Button on the Checkout Page
The checkout page upload option is useful for customers who get all the way to checkout before realizing they have not yet attached their file, or for stores where the file upload is deliberately positioned at the checkout stage rather than earlier in the process.
In the Display On setting, you have two checkout options:
- Checkout Page After Notes: Places the upload button below the order notes section on the checkout page
- Checkout Page Alongside Cart Items: Places the upload button next to each relevant product in the order summary on the checkout page
The alongside cart items option tends to work better from a UX perspective for the WooCommerce file upload checkout setup because it ties the upload directly to the product it belongs to, rather than placing it in a more general position where the connection between the file and the specific product is less clear.
Customers can upload their file at checkout, preview it, attach a note if required, and proceed to place their order with everything attached and ready for admin review.
Allowing File Uploads After the Order Is Placed
Beyond the product, cart, and checkout pages, the plugin also supports file uploads on the Thank You Page and the My Account Page, which covers the scenarios where a customer forgets to upload during the ordering process or needs to replace a file after receiving a rejection.
In the Display On setting, check Thank You Page to show the upload option immediately after order placement, or check Account Page to make it accessible from the customer’s order history in their account dashboard.
From the My Account page, customers can view all their uploaded files, check the status of each one, preview what they submitted, add new files to an order, and replace files that have been rejected, all without needing to contact support to do any of it.
Enabling Allow Upload Modification in the rule settings is what makes this post-order file management possible, so make sure that checkbox is ticked if you want customers to have this flexibility.
Setting Up Recaptcha for Upload Security
The Recaptcha Settings tab adds a security layer to the upload process that prevents automated or spam submissions from cluttering your order management area with irrelevant files.
To enable it:
- Enable or Disable Recaptcha: Check this to turn Recaptcha on for the file upload process
- Recaptcha Site Key: Enter your recaptcha site key from Google
- Recaptcha Secret Key: Enter your recaptcha secret key
If you are running a store with significant traffic or selling products that attract a lot of submissions, having reCAPTCHA active on the WooCommerce upload file process is a sensible precaution that keeps things clean on the backend.
Using the Shortcode for Custom Placement
If you are using a page builder like Elementor, WPBakery, or Divi and you want to place the upload button in a specific position that the standard hook-based placement does not cover, the plugin provides a shortcode for exactly that purpose.
The shortcode [extendons_upload_button] can be placed anywhere on a page through your page builder, and it will render the upload button form in that position. For standard WooCommerce product pages, the upload button is added automatically through hooks, so the shortcode is primarily useful for custom page layouts built with page builders where the standard hook positions may not apply.
Storing Uploaded Files and Google Drive Integration
By default, the plugin stores uploaded files on your hosting server, but for stores with high upload volume, this can start to affect disk usage over time. The plugin offers two ways to handle file storage more efficiently.
Custom Folder Path:
In the Additional Settings section, you can define a custom folder path on your server where uploaded files will be saved. This keeps customer uploads organized in a dedicated location separate from product images and other store files, which makes file management on the backend considerably cleaner.
Google Drive Integration:
For stores that want to offload file storage from the hosting server entirely, the plugin supports Google Drive integration. Enabling this connects your store to a Google Drive account, and all customer uploaded files are saved directly to a specified folder in that Drive rather than on the server.
To set this up:
- In Additional Settings, check Enable Google Drive Uploads
- Create a Google Cloud Project and enable the Google Drive API through the Google Cloud Console
- Configure the OAuth consent screen and create OAuth 2.0 credentials
- Download the credentials JSON file and upload it to the plugin’s Google Drive configuration section under Google Drive OAuth Credentials JSON
- Enter the Google Drive Folder Name where you want uploaded files to be saved
- Click Connect Google Drive or Authorize Google Drive in the plugin settings, and complete the OAuth authorization flow through the Google consent screen
Once connected, all customer file uploads will be saved to the specified Google Drive folder automatically, keeping your hosting server free of large upload files and ensuring the files are stored in an organized and accessible location outside of the server environment.
Conclusion
Setting up a proper WooCommerce upload file system across your product, cart, and checkout pages does not have to be complicated, and with the File Uploader plugin by Extendons, the whole process is manageable from a single settings area without any coding involved.
Whether you are collecting design files on the product page, giving customers a second chance to attach files at the cart stage, or capturing uploads at checkout, the rule-based system gives you the flexibility to set up exactly the experience your store and your customers actually need.
Getting the WooCommerce file upload checkout configuration right from the start saves a lot of operational headache down the line and makes the whole custom order process considerably smoother for everyone involved.
