Applies to Cmsmart Product Designer (NBDesigner) 2.17.0 · Updated October 2026. This guide shows how to configure product designer per product in a WooCommerce T-shirt, apparel or print-on-demand store: enabling the Online Designer on one product, setting its production specs, and wiring up pricing and print-ready output.

In short

  • Turn the Online Designer on for one product at a time, each with its own production specs and print options, instead of one global setting for the whole catalog.
  • A single product screen now covers price, material, bleed, resolution, color profile and the designer canvas, so there is one place to check before a product goes live.
  • Expect 15-20 minutes per product once your templates and printing options are built; no developer or code edit is required.

Shoppers now expect to see their design before they pay, not after a round of emailed proofs. If every product on your site is configured by hand, with no shared pattern between a T-shirt and a sticker, that setup work becomes the bottleneck that keeps new products off your store.

What is the real cost of configuring every product by hand?

Configuring a design area, DPI and a price matrix one product at a time, by trial and error, is where most WooCommerce print stores lose time. Cmsmart Product Designer puts production specs, the designer canvas and printing options on the same product screen, so launching a new design-enabled product is a checklist, not a guessing game.

  • Staff rebuild the same design-area and pricing steps for every new product, with no shared checklist, so each launch takes longer than the one before it.
  • A design area set a few millimeters off the real print area comes back from the press misaligned, and the reprint is the shop's cost, not the customer's.
  • Resolution and bleed are set from memory per product, so one SKU accepts a 72 DPI screen image while a neighboring SKU silently accepts a file too small to print cleanly.
  • Cart abandonment is already high across ecommerce - 70.22% of online carts are abandoned on average - and a personalized product whose final price only appears at checkout, after sizing and print options are picked, gives a shopper one more reason to leave.
  • A growing catalog of stickers, business cards, apparel and photo books multiplies the setup work when there is no single product screen that covers every product type the same way.

What does a great product designer experience look like?

Picture a product page where the design button, the price and the print specs are all driven by the same product configuration - so a buyer never sees a mismatch between what they designed and what ships. Cmsmart Product Designer keeps the canvas, the pricing rules and the production specs on one product record, so that promise holds for every SKU.

Example scenario. A buyer opens an invitation product at 9pm, picks "Design here online" instead of uploading a file, drops in a template, swaps the names and the date, and watches the price update as they add a second side. They check out. By the next morning the order already carries a print-ready PDF sized to that exact product, with the bleed and color profile the product was configured with - no one on the team touched a proof.

WooCommerce storefront product page for an Invitation with the Start and upload design button next to Add to cart
The buyer side of a configured product: price, "Start and upload design" and Add to cart on one page (Cmsmart live demo, 2.17.0).
How would you like to design chooser dialog offering upload a full design or design here online
The chooser a buyer sees once the Online Designer is enabled on a product: upload a finished file, or design online.

Talk to an ecommerce expert about your product catalog if you are planning this for more than a handful of products.

How does Cmsmart connect product configuration to print-ready output?

Cmsmart Product Designer stores four things against every product: the designer canvas (sides, DPI, design areas), production specs (material, bleed, resolution, color profile), printing options (fields and pricing) and the output path that turns an order into a print-ready file. Changing one product never touches another.

  • Storefront: the product page and the "upload a design or design online" chooser buyers see once a product has the Online Designer switched on.
  • Online Designer: the canvas itself - sides, templates, cliparts, text and layers - scoped to the design areas that product's configuration defines.
  • Production specs: material, bleed area, print resolution, color profile and production time, set once per product and shown to shoppers as the short description.
  • Printing options: the price-affecting fields (size, color/material, quantity breaks) applied to one or many products from a single option set.
  • Print-ready output: Create PDF and the print-ready PDF that matches the order (2.17), built from the same product size and bleed the product was configured with.

Cmsmart insight: set the bleed area and print resolution on the product before you build its design templates, not after. Templates built against the wrong canvas size are the most common reason a store ends up reprinting its own catalog once real orders start arriving.

Manual / spreadsheet setupCmsmart Product Designer
Design area per productMeasured by hand, noted in a spreadsheet or a sticky noteSet once on the product's Designer Canvas / Online Designer panel
Print specs (bleed, DPI, color profile)Known by whoever built the first product, often undocumentedProduction specs fields on every product, visible to any team member
Pricing rulesRebuilt per product, easy to miss a size or a quantity breakPrinting Options applied to one product or a whole category
Print file for the pressExported by hand after checking the orderPrint-ready PDF generated to match the order automatically
Cmsmart Manager Products screen listing 34 design-enabled products including Women's T-shirt and Men's T-shirt
Manager Products: every product with the Online Designer enabled, its templates and its status, in one list.

What is the business value of configuring product designer per product?

A product configured correctly once means fewer reprints, fewer support tickets about "why does my order look wrong," and a storefront where every new SKU launches as fast as the last one. Cmsmart Product Designer turns that into a per-product checklist instead of tribal knowledge held by one person.

BenefitHow it shows up in your businessKPI to track
Fewer reprintsBleed and resolution are fixed per product, not guessed at order timeReprint rate per 100 orders
Faster new-product launchesProduction specs and printing options are a checklist, not a rebuildDays from product created to designer enabled and live
Fewer abandoned designsPrice updates live as the buyer adds sides or optionsCart abandonment rate on design-enabled products
Less manual file prepThe print-ready PDF matches the order's exact size automaticallyOrders reaching ready-to-print status without a manual Create PDF click

Rough-cut ROI worksheet. Take the number of design-enabled products you plan to add this quarter (N), the minutes a correct first-time setup saves your team per product versus a trial-and-error setup (M), and your team's loaded hourly cost (C). Time saved on setup alone is N × M × C ÷ 60. Add your current reprint rate (R reprints per 100 orders) and your average reprint cost (P) to estimate what a lower reprint rate from correct bleed and resolution settings is worth: orders per month × R ÷ 100 × P.

The category this sits in keeps growing: the global custom t-shirt printing market was valued at USD 5.2 billion in 2024, projected to reach USD 9.8 billion by 2030 (Grand View Research), which is exactly the kind of growth that rewards a store that can add new design-enabled products quickly instead of rebuilding each one from scratch.

How do you configure product designer per product in WooCommerce?

Configuring product designer per product means working through one product's General, Production specs and Online Designer sections, then pointing it at a printing option set. Cmsmart Product Designer keeps all three on the same screen so nothing is set twice.

  1. Go to Cmsmart → Products (Manager Products) and open the product you want to configure, or add a new one.
  2. Under General, confirm the product name, base price, category and the short description shoppers see under the price.
  3. Open Production specs and set Material (the stock this product prints on), Bleed area in mm, Print resolution and Color profile (CMYK for production, RGB/sRGB for an on-screen-only preview).
  4. Set Production time in business days so the figure shown to buyers matches what your print floor can actually deliver.
  5. Scroll to Online Designer and tick Enable the Online Designer for this product.
  6. Choose the Sides preset (1-sided or 2-sided) for this product.
  7. Click Open Designer config to set the canvas sides, the design area shape and size, and the DPI the designer should save at for this product.
  8. From Printing Options, attach or build the price-affecting fields (size, color/material, quantity breaks) this product should offer, and apply them to the product or its whole category.
  9. Upload the product's gallery images, including the mockup that frames the design area.
  10. Save changes, then use Preview to open the live product page and run through "Start and upload design" yourself before buyers see it.
Configure product designer per product: NBDesigner product configuration screen showing production specs and the Online Designer toggle for a Sticker product
The product configuration screen: General, Production specs and Online Designer on one page, plus a shortcut into the Designer config editor (2.17.0 demo product).
Printing option editor listing online design fields, product builder fields and a quantity discount pricing table
Printing Options editor: the fields a product can show (size, DPI, sides, quantity breaks) and the discount table behind them, shared across products.

For WooCommerce's own product basics - categories, galleries, variations - the WooCommerce product management documentation is the reference; Cmsmart's screens sit directly on top of that same product record. For the design-area shape specifically, see how to configure the area design shape, and for quantity and option pricing, see how to build a price matrix with printing options.

Going further: what can Cmsmart build on top of product designer per product?

The product screen above covers one store on one set of rules. Cmsmart builds the parts that go beyond a single product's settings as custom development, scoped to how your catalog and production floor actually work.

  • Bulk product configuration: cloning production specs and printing options across a whole category in one pass, for catalogs with hundreds of design-enabled SKUs - Cmsmart builds this as custom development for stores past the point where configuring products one at a time still scales.
  • ERP/MIS-driven specs: pulling bleed, material and DPI from your production system instead of the product editor, so a change on the floor updates every product it affects - Cmsmart builds this integration for print shops running their own MIS.
  • Per-product approval rules: routing some products straight to print and holding others (rush jobs, large-format, first-time customers) for manual sign-off - Cmsmart builds custom approval workflows on top of the existing Customer Design approve box.
  • Multi-vendor product configuration: letting vendors in a marketplace configure their own design areas and printing options within limits you set - Cmsmart builds this for multi-vendor web-to-print marketplaces.

Delivery follows the same path for all of it: discovery, solution design, build sprints, QA against your real catalog, launch and ongoing support - see how that plays out in Cmsmart's ecommerce project case studies.

Plan my product configuration project

Why work with Cmsmart to configure your product designer?

Cmsmart has built web-to-print storefronts since 2012 as a Netbase JSC division, with Cmsmart Product Designer (NBDesigner) as its core WooCommerce plugin. Stores already running it rate the plugin and its support highly, in public reviews anyone can check.

  • 6,300+ client projects and 1,800+ live stores since 2012, across 80+ countries.
  • Trustpilot rating of 4.2 from 404 reviews, verified on 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, Trustpilot review

Order screen showing Print-ready PDF status Ready, rendered by the cloud renderer, with a Regenerate print-ready PDF button
What a correctly configured product hands your team on the order screen: a print-ready PDF rendered by Cmsmart Cloud, ready to regenerate if the design changes.
Video thumbnail: how to configure online design for each product
Video: How to Config online design for each product (Cmsmart on YouTube).

Frequently asked questions

Do I have to configure every product separately?

Yes for production specs and the designer canvas, since each product can have its own bleed, resolution and design area. Printing Options are the exception: one option set with its pricing rules can be applied to many products or a whole category at once.

Can I turn the Online Designer on for only some products?

Yes. The Enable the Online Designer for this product checkbox is per product, so a store can mix design-enabled products with ordinary WooCommerce products on the same site.

What happens if I change a product's bleed or DPI after templates already exist?

Existing templates keep the canvas size they were built with. Change production specs before building templates for a product where possible, and treat a later change as a reason to review that product's templates, not just its settings.

Does the print-ready PDF update if a customer edits their design after ordering?

Yes - as of 2.17, editing a design after ordering queues a new print-ready PDF automatically when automatic export is on, and approved artwork is locked against further edits unless a shop manager reopens it.

Can Cmsmart configure our whole catalog for us?

Cmsmart's team can configure products directly or set up the templates and printing-option sets your team then applies across the catalog, and builds bulk or ERP-driven configuration as custom development for larger catalogs.

Related reading: Cmsmart Product Designer (NBDesigner) for WooCommerce, the web-to-print solutions hub, product designer customization services, and the 2.17.0 release notes for the print-ready PDF and approved-artwork lock mentioned above.