WooCommerce Product Designer Settings: Setup Guide

Applies to Cmsmart Product Designer (NBDesigner) 2.17.0 · Updated October 2026. Screens below are from the live Cmsmart admin and the WooCommerce product designer front end, captured on this version.

In short

  • The outcome: a WooCommerce product designer configured for your business, so buyers only see the tools and colors you can actually produce, and every order lands with a print-ready file your team can use.
  • How it works: the Cmsmart › Settings tabs (General, Appearance, Design Tool, Colors, Upload design, Output, Printing Options), the per-product Setting Cmsmart box, and the order screens where your team reviews and approves artwork.
  • What it takes: about an hour to work through the tabs once, a few minutes per new product after that — or hand the setup to Cmsmart.

A WooCommerce product designer looks the same in every demo: a clean editor, a few templates, an instant preview. What decides whether it actually helps your business is what happens in the back end — the Cmsmart settings tabs, the per-product options, and the order screens your team opens every day.

This guide walks through the WooCommerce product designer settings in Cmsmart Product Designer (NBDesigner) 2.17.0, tab by tab, with the real admin screens and the order flow they produce — part of a wider web-to-print setup — so you can configure the designer around your products instead of leaving it on its defaults. WooCommerce now powers more than 4M+ online stores, including 31% of the top 1 million ecommerce sites (WooCommerce, 2026) — getting your product designer configured well is what lets your store compete inside that crowd instead of blending into it.

What does a WooCommerce product designer cost your print shop?

Cmsmart Product Designer ships with sensible defaults, but defaults are generic. Left unconfigured, a WooCommerce product designer invites uploads you can't print, colors outside your palette, and orders without a usable design file — a cost your staff pay for in rework, not your customers.

  • Unusable uploads. No file-type or resolution limit means low-resolution JPGs and stray file formats land in orders your press can't run.
  • Off-palette colors. A full color picker lets buyers choose shades your printer or supplier can't reproduce.
  • Manual exports. Without automatic PDF export, someone opens every order and builds the print file by hand before it can go to production.
  • Disputed orders. If the cart and order screen don't show the customer's actual design, "that's not what I ordered" becomes a support ticket.
  • One-size-fits-all products. The same tool set and DPI apply to a business card and a banner unless you set per-product options.

What does a well-tuned product designer look like for your store?

Set up well, the Cmsmart WooCommerce product designer feels invisible to buyers: they pick a template or upload their own file, see only the tools and colors you allow, and check out against a confirmed preview. Your team opens the order to a print-ready file, not a cleanup job.

Example scenario. A buyer opens an invitation product on your store and picks "Design here online" instead of uploading a file. They customize a template inside the editor, add it to the cart, and check out. Because Auto export design to PDF is switched on, a print-ready PDF is already queued by the time the order reaches your team — nobody has to open the design and export it by hand.

WooCommerce product designer chooser on the Invitation product page: upload a full design or design here online
What a buyer sees when Appearance and Design Tool are configured: a clear choice between uploading a file and designing online.

What's the solution architecture behind Cmsmart's product designer?

Cmsmart configures the WooCommerce product designer in three layers: store-wide settings in Cmsmart › Settings, per-product options on each product's edit screen, and the order and approval screens your team uses in production. The plugin covers all three today; Cmsmart also builds custom tools, pricing and integrations on top where the settings run out.

Diagram: customer design, server-side render, colour conversion, preflight checks, print-ready PDF, printer
What the Output tab's settings produce: a customer design turned into a print-ready PDF.
  • Store-wide settings (in the plugin). General, Appearance, Design Tool, Colors, Upload design, Output and Printing Options — the defaults every designer-enabled product uses.
  • Per-product configuration (in the plugin). The Setting Cmsmart box on each product: design area, bleed, safe zone, DPI, templates, pricing.
  • Order and approval screens (in the plugin). Cmsmart › Orders, the order detail timeline, and the Customer Design box for approving or declining artwork.
  • Print-ready output (in the plugin). Cmsmart Cloud rendering turns the design into a print-ready PDF that matches the order, a change since 2.16.0.
  • Rules the settings can't express (custom development). Printer-specific preflight, custom pricing logic, product-specific editor tools and ERP/MIS integration — built by Cmsmart on top of the plugin.

What's the business value of getting these settings right?

Every settings tab maps to a business outcome: fewer unusable files, colors you can actually print, a faster handoff to production, and fewer disputed orders. Cmsmart's WooCommerce product designer turns those outcomes into specific toggles instead of leaving them to chance.

BenefitSettingKPI to track
Print-quality filesGeneral › Default output resolution - DPI; Upload design › Min. resolution DPIOrders returned for low-resolution artwork
Files ready without manual exportOutput › Auto export design to PDFStaff minutes per order on file preparation
Fewer unusable uploadsUpload design › Allowed / Disallowed file typesUploads that need re-supply
Colors you can printColors › Show all color (off = your palette only)Color complaints and reprints
Fewer "not what I ordered" disputesAppearance › Show customer design in cart, checkout and orderDisputes and refund requests

Rough out the time saved. (orders per month) × (minutes your team now spends manually exporting and checking each design) × (your loaded hourly rate) = the monthly staff time that Auto export design to PDF and the file-type/DPI rules give back. Add (reprints avoided per month) × (cost per reprint) for what the color and resolution settings are worth.

How do you set up the WooCommerce product designer in the back end?

You configure the Cmsmart WooCommerce product designer in two admin screens: the Cmsmart › Settings tabs below, and the Setting Cmsmart box on each product. Work through the tabs once, then check them against every new product before you launch it.

  1. Set your output DPI and layout. In Cmsmart › Settings → General, choose the Modern design editor layout (Classic is deprecated) and set Default output resolution - DPI to 300, the figure most printers ask for; 150 is the plugin default. These apply to every designer-enabled product unless you override them per product.
  2. Decide what buyers see in the editor. In Appearance, turn on Show bleed if your printer needs it, choose which Modern-layout panels (ruler, grid, color palette) show by default, and turn on Show customer design in cart, checkout and order so buyers confirm exactly what they're paying for.
  3. Turn on the tools your product needs. In Design Tool, enable only the tabs a product needs — text, clipart and elements, image upload, free draw, QR codes. Fewer tools make the editor easier for buyers and keep designs inside what you can produce.
  4. Lock the color palette. In Colors, turn off Show all color to restrict buyers to your own palette — the simplest way to keep designs inside the colors your press or supplier can reproduce.
  5. Control what customers upload. In Upload design, set Allowed file types (and Disallowed file types), Min. resolution DPI for JPG/JPEG images, and file-size limits, so only files your production can use get through. Background on resolution rules is in the DPI and print quality guide.
  6. Turn on automatic print-ready PDFs. In Output, switch on Auto export design to PDF so Cmsmart renders a print-ready PDF that matches the order when the buyer clicks Process; set the Order status for auto export design as a fallback check, and choose whether rendering runs on Cmsmart Cloud or your own server.
  7. Set the per-product options. On each product's edit screen, the Setting Cmsmart box controls what's specific to that product: Enable Design or Enable Upload Design, the design and product area, bleed and safe zone, DPI, and which templates it offers. This is where a business card and a banner stop sharing the same rules — see the installation guide for setting up your first product, and the price matrix tutorial for per-option pricing.
  8. Review and approve orders as they arrive. Cmsmart › Orders lists every order with its production status; opening one shows the line item's design file, a production timeline, and quick actions including Download print PDF. On the WooCommerce order screen, the Customer Design box lets you approve or decline the artwork and notify the customer from the same place.
Cmsmart Settings General tab: default design editor layout, default output resolution DPI, dimensions unit, preview sizes
General: the layout, output DPI and unit defaults every product inherits.
WooCommerce product designer Modern editor open on an Invitation product with a template on the canvas
The Modern editor your Design Tool and Appearance settings produce for buyers.
Cmsmart Settings Output tab Synchronize section: Auto export design to PDF, order status, pdfs folder, and file sync destinations
Output › Synchronize: the toggle that turns every order into a print-ready PDF automatically.
Cmsmart Orders screen listing WooCommerce product designer orders with their production status
Cmsmart › Orders: every order with its production status, filterable and searchable.
WooCommerce product designer order detail screen showing the production timeline, design file and quick actions
Order detail: the production timeline, the line item's design file, and quick actions including Download print PDF.
Customer Design box on the WooCommerce order screen with approve, decline and notify-customer controls
The Customer Design box on the order screen: approve or decline the artwork and notify the customer.
Video walkthrough of configuring a product for online design in the Cmsmart WordPress back end
Video: configuring a product for online design in the Cmsmart back end (Cmsmart on YouTube).

Cmsmart insight: turn on Auto export design to PDF and Show bleed together, and set the output DPI your printer asks for, before you take real orders. Turning them on later means your first orders still need manual exports. If you sync output files to a print server, test one order end to end first so folder names and permissions are right.

Going further with custom development

When the settings can't express a business rule, Cmsmart builds it as custom development on top of the WooCommerce product designer: product-specific tools, pricing engines, printer-tuned preflight, and integrations that send orders and files to your MIS or ERP. Delivery runs discovery, design, sprints, QA, launch and support.

  • Custom editor tools and templates. Complex products need guided design — we build tools, layouts and templates for your catalogue.
  • Pricing engine. Price by size, material and quantity without manual quotes — we build your formulas and B2B price lists.
  • Preflight tuned to your printer. Catch bleed, resolution and color problems before production — we configure and extend AI preflight checks for your specs.
  • Production integration. No re-keying between store and print floor — we connect orders and files to your MIS or ERP.

See the project delivery model and the product designer customization service.

Get a product designer customization quote

Why work with Cmsmart?

Cmsmart has configured and built on the WooCommerce product designer for stores since 2012, as part of Netbase JSC. The same team that sets up these settings tabs also builds the custom development most stores eventually need — pricing engines, preflight and production integrations.

Cmsmart has built ecommerce and web-to-print stores since 2012 as a division of Netbase JSC: 6,300+ client projects and 500+ custom development projects (WorkSuite project records, Sep 2026), rated 4.2 on Trustpilot (404 reviews). See our related projects.

Frequently asked questions

Where are the NBDesigner settings?

In WordPress admin under Cmsmart › Settings. Per-product options are in the Setting Cmsmart box on the product edit screen.

Which layout should I use?

Modern. Classic is deprecated and gets no new features.

How do I get print-ready PDFs automatically?

Switch on Auto export design to PDF in Output. It's queued when the buyer clicks Process, and the order artwork screen shows its status — Ready, Rendering, Failed or Not rendered — with a Regenerate option.

How do I limit which file types customers upload?

Fill in Allowed file types (and/or Disallowed file types) in the Upload design tab.

Can Cmsmart configure the settings for my products?

Yes. Setup and product designer customization are Cmsmart services; request a quote with your products and printer specs.

Can Cmsmart connect the designer to my MIS or ERP?

Yes, as custom development — we build the integration that sends orders and print files to your production system.

Make every order arrive ready to print

Tell us your products and your printer's specs. We configure and extend the Cmsmart Product Designer so buyers design within what you can produce and your team receives files it can use.

Plan my product designer setup Or start the free 30-day trial

David Nguyen

David Nguyen

eCommerce consultant
Member since Jan 2020
318 Posts
213,018 Views
0 Helpful
David Nguyen — Founder & CEO, Cmsmart Ecommerce (a Netbase JSC division since 2012)
Direct contact & support

Need help fast? Message me anytime: