Applies to Cmsmart Product Designer (NBDesigner) 2.17.0 · Updated October 2026. Based on a live walkthrough of Manager Products, a product's Designer config and Printing Options on the current NBDesigner demo store.

In short

  • Turn any WooCommerce product into one buyers can design online and you can price, produce and ship without a single back-and-forth email.
  • Cmsmart adds production specs, an online designer toggle and a price-matrix editor to the product, so pricing and print files follow the same setup every time.
  • It takes a WooCommerce product, the item's print specs (material, bleed, DPI, color profile) and about 15–30 minutes per product the first time through.

Cmsmart Product Designer lets you set up products for online design directly inside WooCommerce: production specs, a price matrix and an online canvas attached to the product page, so a buyer can personalize an item and your team receives a print-ready file instead of a design request to quote by hand.

Why Does Setting Up Products for Online Design Cost You So Much Staff Time?

Cmsmart configures price, print specs and the online designer once per product, so a shop that used to rebuild a quote in a spreadsheet for every custom order instead lets WooCommerce handle pricing automatically and routes every order straight to a print-ready file.

Most online print shops and personalization brands still run the quoting side of the business by hand, even after they already have a designer tool on the product page. The signs show up the same way everywhere:

  • A customer asks for a size, material or quantity the product page doesn't price, so someone emails a quote.
  • Print specs — bleed, DPI, color profile — live in a shared document instead of on the product, so a cloned product or a new hire gets the defaults.
  • Every new product line means rebuilding the price matrix from scratch, because the last one was never saved as a reusable option set.
  • Orders arrive with a design but no print-ready file, so someone opens the order by hand to generate one before it can go to production.
  • Reprints trace back to a spec that was correct in the quote email but never made it onto the actual product.

None of this needs more staff to fix. It needs the pricing and print rules to live on the product itself, not in someone's inbox. If your team spends even ten minutes turning a custom request into a quote and you get twenty of those a week, that is over three hours of staff time every week spent before a single order is placed — time a correctly configured product and price matrix gives back immediately.

What Would a Self-Service Design Catalog Look Like for Your Store?

Cmsmart turns each product page into a self-service design counter: the buyer picks a template or starts from a blank canvas, watches the price update live as they choose options, and checks out, while your team opens a morning queue of print-ready files instead of a pile of quote requests.

Example scenario. A stationery shop lists twenty invitation and card designs, each with its own paper stock, quantity breaks and turnaround time. A buyer opens a product at night, picks a ready-made template, swaps in their own names and date, watches the price change as they add a finish option, and checks out. Nobody on the shop's team touches the order until the next morning, when it shows up in Orders with its design, its price-matrix line items and a print-ready PDF already attached.

Demand for this kind of personalization keeps growing: the U.S. personalized-gifts market alone is on track to grow by $3.85 billion between 2022 and 2027, an 8.65% CAGR (Technavio, 2023). Shops that can light up a new design-enabled product in minutes capture more of that growth than shops still quoting by email.

How Does Cmsmart Turn a WooCommerce Product Into a Design-Ready Product?

Cmsmart adds three layers to a normal WooCommerce product: production specs for the print file, an online designer canvas the buyer uses, and a price matrix that reacts to the options they pick — configured once in wp-admin and reused for every order that product receives.

More than 4 million stores now run on WooCommerce, and roughly 31% of the top one million ecommerce sites use it as their platform (WooCommerce), so a product-setup workflow that saves ten minutes per product scales across a market that size. Manager Products is where that setup starts: one screen listing every design-enabled product, how many templates each one carries, and its base price and status.

Cmsmart Manager Products screen used to set up products for online design in WooCommerce, listing enabled products and templates
Manager Products: every design-enabled product, its category, base price, status and attached templates in one list.

Opening a product from that list takes you to its Designer config, where Production specs — material, bleed area, print resolution and color profile — sit next to the normal WooCommerce product fields WooCommerce documents for name, price and category. A single checkbox, Enable the Online Designer for this product, plus a 1-sided or 2-sided preset, turns the canvas on.

NBDesigner product configuration screen showing production specs: material, bleed area, print resolution and color profile
Production specs on a product's Designer config: material, bleed area, print resolution, color profile and production time.

Cmsmart insight: check Production specs every time you duplicate a product to create a new one. Cloning carries the bleed, DPI and color-profile values along with it, and the most common reprint cause we see in setup reviews isn't a bad design — it's a spec that was right on the original product and wrong on the copy.

Once a product can be designed online, Printing Options is where you attach its price matrix: quantity-break pricing, the fields the buyer sees on the product page, and the print-ready file's output settings all come from the same option set. Cmsmart's cloud renderer then produces a print-ready PDF that matches the order — including a custom width and height the buyer chose, not just the product template's default size, a fix that shipped in 2.17 so Process and Create PDF never disagree on the file a merchant downloads.

Step in the catalog workflowManual setup (spreadsheet + email)Cmsmart-configured product
Pricing a custom size or quantityStaff member calculates and emails a quotePrice matrix recalculates on the product page
Print specs (bleed, DPI, color profile)Kept in a shared document, easy to miss on a cloneStored on the product's Designer config
New product launchPrice matrix rebuilt from scratchExisting option set applied to the new product
Print-ready fileGenerated by hand after the order arrivesRendered automatically to match the order
Buyer experienceWaits for a quote before they can payDesigns, prices and checks out in one visit

What Business Value Does This Product Catalog Deliver?

Cmsmart's product setup turns pricing and print rules into a one-time configuration, so the business value shows up as fewer manual quotes, fewer reprints from spec mistakes, and new product lines that go live in minutes instead of a developer ticket.

  • Fewer manual quotes. Shows up as fewer sales emails per order; KPI to track: quote requests per week.
  • Fewer reprints. Shows up as fewer orders flagged for a wrong bleed, DPI or color profile; KPI: reprint rate.
  • Faster new-product launches. Shows up as a new design-enabled product going live without a developer ticket; KPI: time from "add product" to "live for sale".
  • Self-service checkout. Shows up as buyers pricing and paying without an email exchange; KPI: cart abandonment on design-enabled products.

Rough-cut ROI worksheet. Minutes you currently spend turning a custom request into a quote, multiplied by custom requests per month, multiplied by your team's loaded hourly rate, gives you the monthly cost of the status quo. Compare that to the one-time setup time per product — production specs, price matrix, template — to see how many months it takes a single product to pay for its own setup.

How Do You Set Up Products for Online Design in WooCommerce?

Setting up a product takes four screens in Cmsmart: Manager Products, the product's Designer config, Printing Options and a quick check on the storefront — usually 15 to 30 minutes the first time and faster once you copy an existing option set.

The screenshots in this guide are from a live NBDesigner 2.17 install. Work through the fields in this order and the online designer, the price and the print-ready PDF stay in sync.

  1. Open Cmsmart → Manager Products and check which products already have the online designer enabled, and how many templates each one carries.
  2. Add the product in WooCommerce the normal way: name, base price, category and description — the same product data WooCommerce documents for any product type.
  3. Open the product's Designer config and fill in Production specs: material, bleed area, print resolution (DPI) and color profile. These travel into the print file, not just the product description.
  4. Turn on Enable the Online Designer for this product and pick a 1-sided or 2-sided canvas.
  5. Go to Printing Options → Add new and build the product's price matrix: quantity breaks, the fields buyers see (size, color/material, custom dimensions) and, if the job needs them, the Delivery date and Artwork actions fields.
  6. Apply the option set to this product, or to a whole category, and set its priority if more than one option set could otherwise match the same product.
  7. Attach a starter template from Manage templates so buyers see a finished layout instead of a blank canvas.
  8. Preview the product as a shopper and confirm the design chooser offers the paths you expect: upload a finished file, design online, or start from a template.
  9. Open the online designer itself and check that fonts, cliparts and the template you attached all load correctly before you publish the product.
  10. Place a test order and open it in Cmsmart → Orders: confirm Create PDF shows a print-ready PDF at the product's own paper size, not a generic template size.

Cmsmart insight: the Priority field on each printing option set decides which one wins when a product could otherwise match more than one — set it deliberately instead of leaving every option set at the same priority, or the wrong price matrix can apply after you add a new, more specific option set.

What this looks like once it is configured:

Printing Options list in WooCommerce showing price-matrix option sets, priority and the products they apply to
The Printing Options list: each row is a price-matrix option set, with its priority and the products or categories it applies to.
Edit Options screen for online design fields, including Delivery date and Artwork actions fields, plus quantity-break pricing
Inside an option set: online design fields including the Delivery date and Artwork actions default fields, plus quantity-break pricing.
Storefront chooser asking how a buyer would like to design their product: upload a file or design online
What buyers see once the product is configured: a choice between uploading a finished file or designing online.
Online product designer open on a product page with a ready-made invitation template on the canvas
The online designer opens with the template you attached, ready for the buyer to personalize.
Create PDF admin screen confirming a print-ready PDF status rendered at the product's own paper size
After checkout, Create PDF confirms the print-ready PDF rendered at the product's own paper size via the Cmsmart Cloud renderer.
Video thumbnail for configuring and using the price matrix feature in Cmsmart Product Designer
Video: How to configure and use the price matrix feature (Cmsmart on YouTube).

Going Further: What Can Cmsmart Build on Top of Your Product Catalog?

Once the catalog is set up, Cmsmart builds the parts that go beyond a single product's price matrix: bulk catalog imports, custom pricing engines, ERP-linked B2B catalogs and production rules a standard option set was never designed for — all delivered as custom development, not a plugin toggle.

  • Bulk catalog import. Cmsmart builds a spreadsheet or ERP import for stores adding hundreds of design-enabled SKUs at once, instead of configuring each one by hand.
  • Gang-sheet and nesting layouts. For DTF and large-format print shops, Cmsmart builds the layout rules that pack multiple designs onto one sheet as custom development, sitting outside the standard price matrix.
  • ERP/MIS-synced B2B catalogs. Cmsmart builds a sync between your price lists or stock levels and the Printing Options price matrix, so a B2B catalog stays current without manual edits. See our B2B web-to-print work.
  • Custom pricing logic. When quantity breaks and size or material upcharges aren't enough — set-up fees, customer-group pricing, area-based pricing — Cmsmart's pricing engine team builds the calculation your products need.

Projects like these follow the same delivery path regardless of size: a discovery call, a written solution design, build sprints with milestones you can see in your own client dashboard, QA, launch and support after go-live. See how we run ecommerce projects end to end, or start with our web-to-print solutions overview.

Plan My Product Catalog Build

Why Work With Cmsmart to Set This Up?

Cmsmart has configured web-to-print product catalogs since 2012 as part of Netbase JSC, with 6,300+ client projects and 1,800+ live stores running today — the same team that builds your product setup also builds whatever custom development comes after it.

Cmsmart, a division of Netbase JSC, has been building WooCommerce and web-to-print software since 2012, with 6,300+ client projects across 80+ countries. The Cmsmart Product Designer holds a 4.2 rating from 404 reviews on Trustpilot.

"The product designer is exactly what we needed. Lots of features and very well designed. The pricing is great. The support was great," wrote Franklin (US), a verified Trustpilot reviewer, about the same plugin this guide configures.

Related reading: how to design a product with Cmsmart Product Designer covers the buyer-side design flow in more depth, and setting upload rules for customer files is the next screen worth configuring once your price matrix is live.

Talk to the Product Designer Team

Frequently Asked Questions About Setting Up Products for Online Design

Do I need coding skills to configure a design-enabled product?

No. Manager Products, a product's Designer config and Printing Options are all wp-admin screens: production specs, the designer toggle and the price matrix are form fields, not code. Custom pricing logic or catalog imports beyond that are the kind of work Cmsmart builds as a project.

Can one price matrix cover several products?

Yes. Apply the same Printing Options set to a whole category instead of a single product, and use the priority field when more than one option set could otherwise match the same item.

What happens if I change the bleed or DPI after orders start coming in?

Existing print-ready files don't regenerate on their own. Use Regenerate print-ready PDF on an order that needs the new spec, since the updated Production specs apply to new designs going forward rather than rewriting files already on file.

Can customers still upload their own finished file instead of using the online designer?

Yes — the design chooser on the product page offers "Upload a full design" alongside "Design here online," and both routes end in the same print-ready file on the order.

How long does a custom catalog build — bulk import, a pricing engine, ERP sync — usually take?

It depends on scope: a scoping call turns into a written proposal with milestones before any work starts. Treat the setup time in this guide for a single product as the manual baseline Cmsmart's custom development work is built to replace at scale.