WooCommerce Product Designer Plugin: Full Setup Guide

Applies to Cmsmart Product Designer (NBDesigner) 2.17.0 · Updated October 2026. This guide replaces our earlier Tee-Pro Solution walkthrough with the current settings screens, print-ready PDF behavior and AI tools shipped in the 2.17 line.

A buyer who can see their own design and a firm price before committing to a print job checks out; one stuck emailing a logo back and forth usually does not. A WooCommerce product designer plugin — Cmsmart Product Designer (NBDesigner) — turns the second buyer into the first, and its settings, not custom code, do most of the work.

What does manual product customization actually cost your store?

Personalization demand keeps growing — the global print-on-demand market was valued at $10.8 billion in 2025 and is projected to reach $57.5 billion by 2033, a 23.6% CAGR (Grand View Research, 2025) — but most of that growth goes to storefronts that can quote and produce without a manual back office. Before a store turns on an online designer, a "custom" order usually runs through the same five steps, each one a place to lose the sale or the margin:

• Manual quoting. A staff member prices every size, material and quantity combination by hand, by email, often hours after the visitor has moved on.
• Proof ping-pong. Artwork goes back and forth as an attachment until someone spots the wrong bleed, the wrong resolution or the wrong side — sometimes after it is already printed.
• Reprints. A low-resolution logo or a missing bleed line that nobody caught becomes a reprint, which eats the margin on the next two orders.
• Cart abandonment. The average documented online cart abandonment rate is 70.22%, and a checkout that cannot show a price until "we'll get back to you" gives a visitor one more reason to leave (Baymard Institute, 2025).
• Staff time. Every manual quote and proof review is time your team is not spending on production or new business — multiply your own order volume by minutes-per-order to see the real monthly cost.

What does a self-service design flow look like for your store?

On the product page itself, the flow starts with a "Start and upload design" button and, once a buyer chooses to design online, opens a full in-browser editor with templates, text and clipart:

Nothing here is a mockup: the designer records every layer, so the file an admin downloads later is the file the buyer actually approved.

How does Cmsmart turn a WooCommerce product into a design tool?

Four building blocks do the work, and each one is a settings screen you configure once per store (then, usually, once per product):

• Design tool defaults (General). Editor layout — Modern is current; Classic is deprecated — default output DPI, dimension units, and whether customers may save or share a design in progress.
• Upload rules (Upload design). Allowed and disallowed file extensions, size and file-count limits, a minimum DPI for raster uploads, and which import sources (Facebook, Instagram, Google Drive, Dropbox) you allow.
• Output and print-ready files (Output). Watermarking, bleed display, PDF password protection, and the export pipeline that produces the file production actually prints from.
• Pricing (Printing Options). Admin-defined fields — size, material, sides, finish — wired into a 2D price matrix with quantity breaks, applied to specific products or categories.

Since 2.17.0, the file production receives is held to the same geometry the admin sees on screen: automatic print PDFs now match the Create PDF output even for a buyer's custom width and height, and the render certificate records which renderer produced it. A design whose order item is already approved is also locked on the server against further saves — the approved-artwork lock, enforced centrally rather than only hidden behind an "Edit design" button.

Need a case like yours mapped out before you commit a sprint? Talk to an ecommerce expert — see "Going further" below for what the custom column usually involves.

What's the business value of setting this up properly?

How do you set up and configure the WooCommerce product designer plugin?

1. Confirm your plugin line. Check Plugins for Cmsmart Product Designer (NBDesigner) on the 2.17.x line before you change anything — the print-ready PDF and approved-artwork lock behavior below assume it.
2. Set your design tool defaults (General). Choose the Modern editor layout, your default output DPI and dimension unit, and whether customers may save a design for later or share it.



3. Decide what customers may upload (Upload design). Set allowed and disallowed file extensions, a minimum DPI for raster uploads, and a max file size; turn on Facebook, Instagram, Google Drive or Dropbox import only if you want them.



4. Configure output and print-ready files (Output). Set bleed display, decide whether designs carry a watermark before checkout, and turn on automatic export to PDF so the print-ready file renders as soon as an order reaches your chosen status.
5. Turn on AI Tools (Cmsmart Cloud). Enable AI Preflight with your required DPI, decide who may use customer-facing AI (everyone, members only, or customers who have ordered), and set a daily run limit so one visitor cannot spend your whole balance.



6. Build your pricing (Printing Options). Add an option group, add the fields you actually sell on (size, material, sides), attach a price matrix, and set quantity breaks.



7. Enable the designer per product. In Manager Products, turn on the Online Designer for each product, then set its sides, bleed, resolution and color profile in that product's design configuration.





8. Test the buyer flow end to end. Open the product as a visitor, design something, click Process, confirm the design shows as "Your artwork" next to Add to cart, and carry it through to checkout.
9. Test the admin flow end to end. Open the resulting order in Cmsmart > Orders, confirm the Customer Design box shows the artwork for approval, download the print-ready PDF, and check the Files list.

For the deeper settings — SFTP/S3 output sync, per-category clipart libraries, license and domain management — the plugin's own WooCommerce product settings and the Cmsmart tabs link out to the right place; this walkthrough covers the configuration every store needs first.

What can Cmsmart build on top of the standard designer?

Four extensions come up most often once a store has the core designer running:

• Cost-plus and B2B pricing. The built-in price matrix handles size-and-quantity pricing well, but cost-plus formulas, negotiated account pricing or quantity breaks pulled from another system are custom development — Cmsmart builds the pricing logic the standard price matrix cannot express on its own.
• DTF and gang-sheet production. Stores selling direct-to-film transfers or sheet-based production often need a gang-sheet builder that packs multiple designs onto one print sheet. That is not a standard designer feature, so Cmsmart builds it as a dedicated tool for that production line.
• Augmented reality and richer 3D configurators. A basic 3D preview of the finished product ships in the Online Designer as a per-product toggle (desktop only). Taking that further — augmented reality on a buyer's phone, or a full 3D configurator with rotating parts and material swaps — is a custom integration layered on top of the standard designer output.
• ERP, MIS and accounting sync. Pushing paid, print-ready orders into a production MIS or accounting system is store-specific integration work, built against the system you already run.

Every one of these follows the same delivery model: discovery, a solution design you approve, build sprints, QA against your real catalog, launch, then ongoing support — the process behind the ecommerce projects Cmsmart has delivered since 2012, and the same approach documented in the web-to-print storefront guide.

Get a custom pricing or production quote

Why work with Cmsmart on your product designer setup?

• 6,300+ client projects and 4,600+ projects delivered since 2012.
• 1,800+ live stores running right now, in 80+ countries.
• Trustpilot rating 4.2 out of 5 from 404 reviews (Trustpilot).

"We have had the NB Designer plugin installed for three years and have experienced absolutely no problems during that time. It is wonderful to see their commitment to continuous development, with new features being added frequently to keep the software current and highly capable." — Web Developer, United Kingdom, via Trustpilot.

For related setup work, see setting up a custom bag store, or explore the web-to-print solutions hub and the product designer customization service for what a scoped engagement looks like.

Frequently asked questions

How long does it take to set up the online product designer?

Working through General, Upload design, Output and Printing Options for one product category usually takes an afternoon. Rolling it out across a full catalog, with a price matrix per category and tested buyer/admin flows, typically takes a few days of focused work.

Can the price matrix handle B2B or wholesale pricing?

The built-in Printing Options price matrix handles size, material and quantity-break pricing out of the box. Negotiated account pricing, cost-plus formulas or prices pulled from another system are custom development, built on top of the same product configuration.

Does the print-ready PDF really match what the customer approved?

Since 2.17.0, automatic PDF export and the admin's Create PDF button read the same page geometry, including a buyer's custom width and height, and the render certificate records which renderer produced each file — so the print file matches the order, not just the template.

What file types and DPI should we require from customers?

Set allowed/disallowed extensions and a minimum DPI in Upload design, then confirm the target with AI Preflight's required-DPI setting in Cmsmart Cloud (300 DPI is the common print-production target). Reject low-DPI uploads before checkout rather than catching them at the press.

Can this connect to our ERP or production system?

Not out of the box — order and design data lives in WooCommerce and the plugin's own tables. Syncing paid, print-ready orders into an ERP, MIS or accounting system is store-specific integration work that Cmsmart scopes and builds as a custom project.

Do we need a developer, or can our team configure this alone?

The settings in this guide — General, Upload design, Output, Printing Options and per-product configuration — are built for a store owner or manager to run without writing code. A developer becomes useful once you move into custom pricing logic, integrations or production tooling.