Applies to Cmsmart Product Designer (NBDesigner) 2.17.0 · Updated October 2026. Covers the in-browser text tool, the font picker, curved text, and how a shopper's typed text turns into a print-ready file.

In short

  • Shoppers type their own message straight onto a mug, tee, invitation or sign and see it rendered on the product before they pay, instead of emailing text back and forth with your team.
  • Cmsmart Product Designer gives every text box a font picker, a curved-text option, size, color and alignment controls, and locks the approved artwork once production starts.
  • Setup takes a product, a template with an open text area, and a few minutes in Settings; going further (custom fonts, engraving-style effects, bulk name lists) is custom development.

What does it cost to sell personalized products with custom text by hand?

Cmsmart Product Designer replaces manual text typesetting with a live, in-browser text tool, so a WooCommerce store stops losing staff hours and sales to back-and-forth proofing emails on every order.

If your store takes custom text by order note or email, the cost shows up in a few predictable places:

  • Staff time typesetting. Someone opens the order, re-types the wording into a design file, picks a font that looks close to what the customer described, and exports a proof.
  • Proofing delay. The proof goes back by email. The customer replies the next day with a spelling fix or "can the font be bigger," and the order sits.
  • Checkout abandonment. A shopper who can't see their text on the product before paying may just close the tab. Baymard Institute's meta-analysis of 50 studies puts the average documented cart abandonment rate at 70.22% (Baymard Institute, updated September 2025) — uncertainty about the finished product is one of the frictions behind that number.
  • Reprints from miscommunication. A font substitution, a misheard date, or a line that didn't fit the print area turns into a reprint — materials, production time, and goodwill, gone.
  • Font licensing risk. Staff under deadline pressure sometimes grab a font from a random "free fonts" site, without checking the license covers commercial print.

Cmsmart insight: most reprint causes on text-heavy orders trace back to the font or the text box, not the artwork — a font substituted at typesetting time, or text proofed at one size and printed at another. A live, on-product text tool removes both failure points because the shopper sees the real font at the real size before checkout.

What would it look like if shoppers typed their own words straight onto the product?

With Cmsmart Product Designer, a shopper opens the product, clicks into a text box, types their own wording, picks a font and a curve, and watches the product update live — so what they see at checkout is what gets printed.

Picture the editor open on a mug. The shopper clicks "Add curved text," types two names and a date, resizes it to fit the handle side, and swaps in a script font from the list. No email, no waiting for a proof, no back office involved yet.

Curved text option in the panel stores use to sell personalized products with custom text in Cmsmart Product Designer
The text panel's quick actions include a dedicated "Add curved text" option alongside heading, subheading and body text — today's capture on nbdesigner.cmsmart.net.

Example scenario: a gift shop sells engraved-look jewelry. A shopper opens a ring listing at 10pm, types a short phrase, previews it curved around the band, and checks out. The order lands in the dashboard the next morning with the exact wording and font attached — no late-night email to answer. The same flow works for a tote, a cap, or a canvas print; the text box doesn't care what it's printed on. Cmsmart's jewelry store solution is built around this kind of engraving-style personalization.

That's the moment this feature is for: the shopper does the typesetting themselves, on the actual product. Want to talk through what that would look like for your catalogue? Talk to an ecommerce expert.

How does Cmsmart turn a typed message into a print-ready file?

Cmsmart Product Designer gives every text layer its own font, size, color and curve controls, locks the design once an order is approved, and renders a print-ready PDF that carries the exact font and text the shopper chose — no retyping on your side.

Four pieces work together, all in the plugin today:

  • The text tool. Each text box gets its own mini toolbar: font family, size, color, alignment, bold/italic, line spacing, and a dedicated curved-text mode, on any design area of any product. We saw this toolbar — font dropdown set to "Roboto," full font list one click away — on both a t-shirt and a mug in today's capture, so it isn't locked to one product type.
  • The font library. Cmsmart bundles a large library of Google font families, managed from the Fonts page under the admin's "Media" group, which 2.17.0 gave its own server-side search and pagination so a big list stays fast to browse. We won't print an exact count, since the library changes release to release — check the Fonts page in your own admin.
  • The approved-artwork lock. Once an order's design is approved, saving over it is refused server-side, from any entry point that would otherwise let the file change — protecting the text and font the shopper actually saw and paid for.
  • The print-ready PDF. Cmsmart Cloud renders the order's print file and pins the fonts and assets the design used to that order, so the PDF the admin downloads matches what rendered on the shopper's screen, not a re-typeset approximation.
Cmsmart admin Create PDF screen showing a Ready print-ready PDF status and a Font configuration tab
The Create PDF screen shows the print-ready PDF status rendered by Cmsmart Cloud, plus a Font tab for the PDF's own type settings — today's admin capture.
Manual text orders vs. Cmsmart Product Designer
StepManual / email workflowCmsmart Product Designer
Getting the wording rightStaff retype the customer's text into a design fileShopper types directly into the text box on the product
Choosing a fontStaff pick a "close enough" font, sometimes from an unlicensed sourceShopper picks from the bundled, licensed font list
Seeing the resultEmailed proof, usually a day's turnaroundLive on-product preview before checkout
Late changesRe-opens the design file, re-exports, re-emailsBlocked once the design is approved (approved-artwork lock)
Producing the print fileManual export, hoping the font embedded correctlyCloud-rendered print-ready PDF matching the order's fonts

The full editor — templates, cliparts, photo uploads and the text tool together — is covered on the Cmsmart Online Designer product page, and ships as part of the Cmsmart Product Designer (NBDesigner) plugin for WooCommerce.

What's the business value of letting shoppers set their own text?

A built-in text and font tool turns personalization from a staffed service into a self-serve feature, so Cmsmart merchants spend less staff time per order and see fewer reprints caused by miscommunicated wording.

Where the value shows up
BenefitHow it shows up in your businessKPI to track
Less manual typesettingStaff stop re-keying customer wording into a design file for every orderMinutes of staff time per personalized order
Fewer proofing emailsThe shopper proofs their own text on the product before checkoutOrders requiring an email round-trip before production
Fewer reprintsFont and text shown at checkout match what prints, because the PDF is cloud-rendered from the same designReprint rate on text-customized orders
Faster checkout decisionShoppers who can preview their text are less likely to abandon the cart to "think about it"Cart-to-order conversion on personalized SKUs

Personalization is also a growing share of what shoppers look for: the global personalized gifts market was valued at roughly $30.79 billion in 2025, forecast to reach $33.49 billion in 2026 (The Business Research Company, 2026), and Deloitte's 2024 research found consumers who prefer brands offering personalized experiences report spending 50% more with those brands (Deloitte Digital, June 2024).

ROI worksheet (use your own numbers):

  • Monthly staff cost of manual typesetting ≈ orders/month with custom text (O) × minutes of staff time per order (M) ÷ 60 × hourly design-staff cost (H)
  • Monthly reprint cost from text/font errors ≈ O × current reprint rate on text orders (R%) × average cost per reprint (C)
  • Compare that total against the one-off setup or custom-development cost of a self-serve text tool to see the payback period for your own volume.

How to set up custom text products in Cmsmart Product Designer

Setting up custom text takes a product with the designer enabled, a template with an open text area, and a check of your font and output settings in Cmsmart Settings — most stores can configure one product in under an hour.

On your side, before a shopper ever sees the text tool:

  1. Install and activate Cmsmart Product Designer (NBDesigner), then confirm the active version under Plugins.
  2. In Settings > General, set your default design editor layout (Modern is recommended) and your default output resolution in DPI.
  3. Open the product, turn its designer on, and either start from a blank canvas or build a template with a text layer already placed where names or messages should go.
  4. Check the Fonts page under the admin's Media menu group to see which font families are available, and add or categorize fonts there if your store needs a specific look (see the video below).
Video thumbnail for managing the WooCommerce online designer font library in the admin
Video: How to manage the WooCommerce Online Designer font library in the backend (Cmsmart on YouTube).

What the shopper does on the product page:

  1. Opens the product page, which shows the price and a button to start the designer.
  2. Chooses "Design here online" (versus uploading a finished file) from the chooser screen.
  3. Clicks into the text panel and picks a quick action — heading, subheading, body text, or "Add curved text" — then types their own wording.
  4. Uses the text toolbar to pick a font family, size, color and alignment, exactly as shown on both captures above.
  5. Clicks Process to reach "Your artwork," where the rendered preview — the actual font, size and curve chosen — is what gets added to the cart.
  6. Completes checkout; the order lands in your Orders dashboard with the custom text already attached.
NBDesigner product page for a personalized invitation with a Start and upload design button
The product page is the shopper's entry point — price, a short description, and the button that opens the designer.
Cmsmart design chooser letting a shopper pick Upload a full design or Design here online
The chooser screen splits shoppers who already have artwork from shoppers who want to design — and type their text — in the browser.
Font family picker and text toolbar open on a custom text t-shirt design in the Cmsmart online designer
The same text toolbar — font family, size, color, alignment — on a T-shirt design, today's capture.
Custom text toolbar with font, size and color controls on a personalized mug design
And on a mug: the text tool and font picker aren't tied to one product type, today's capture.

On the admin side once the order arrives:

  1. Open Orders, find the order awaiting review, and open its Customer Design panel to see what the shopper typed and which font they used.
  2. Accept or decline the design, optionally with a note, which locks the approved version against further edits.
  3. Confirm or regenerate the print-ready PDF; Cmsmart Cloud renders it from the same approved design, fonts included.
Cmsmart admin Customer Design box approving a shopper's custom design before production
The Customer Design box is where an admin accepts or declines a shopper's personalized design — this locks it once approved.

Going further with custom development: text features beyond the core plugin

The core text tool covers font, size, color, alignment and curved text out of the box; for anything more specialized — custom font uploads for a brand's own typeface, engraving-depth effects, or bulk name-list personalization — Cmsmart builds it for your store as custom development.

A few extensions merchants ask for once the basic text tool is live, labeled honestly as what they are:

  • Store-specific custom font uploads. The bundled library covers most storefronts; a brand's own licensed typeface, available only on your site, is custom development.
  • Bulk/CSV name personalization. For a B2B buyer ordering 200 engraved name badges or team jerseys at once, Cmsmart builds a bulk-upload flow that maps a spreadsheet of names onto the same text layer.
  • Engraving- or embroidery-style text previews. A flat font preview reads differently from a simulated laser-engraved or embroidered look; Cmsmart can build a rendering pass that approximates the production technique.
  • AI preflight on text-heavy designs. The plugin's AI preflight already flags common production issues; extending it with text-specific rules (minimum readable size at the product's print DPI) is a scoped add-on.

Delivery follows Cmsmart's normal project model: discovery, solution design, milestone-based sprints, QA, launch and support — see Cmsmart ecommerce projects for how that runs end to end.

Get a custom text-tool quote or read more about the Cmsmart product designer customization service.

Why work with Cmsmart for your personalized text products?

Cmsmart has built and supported WooCommerce product customization as a Netbase JSC division since 2012, with thousands of live stores running the same designer and font tools described in this guide.

Cmsmart (a Netbase JSC division, operating since 2012) has delivered 6,300+ client projects in 80+ countries, with 1,800+ live stores on the platform today and a 4.2 rating from 404 reviews on Trustpilot. One merchant running a multi-product personalization store put it this way:

"I have NBDesigner installed on my website. We sell a wide variety of products from mugs, custom tees, name badges, canvas print and more. NBDesigner has lots of variable options, including colour and image swatches and pricing tables and much much more." — Ray Barlow, Trustpilot review

Related reading: starting a photo printing business with web-to-print software and 12 T-shirt design ideas for when text is only part of the design.

Frequently asked questions about selling custom text products

Does the text tool work on any product, or only mugs and T-shirts?

Any product with the Cmsmart designer turned on — the text panel and font picker are the same tool regardless of product type. We captured it on both a mug and a T-shirt here, and the same panel is available on invitations, signage, jewelry listings or any other design area.

Can shoppers change the font, or just the words?

Both. Each text box has its own font family dropdown, size, color and alignment controls, plus a dedicated curved-text mode.

What happens if a customer wants to change their text after ordering?

Settings > General can allow customers to re-design or re-upload after ordering, but once an admin approves the design, the approved version is locked on the server — any further change goes through your review process.

Do we need our own fonts, or are we stuck with what's bundled?

The plugin ships a large bundled library of Google font families, which covers most stores out of the box. A brand's own licensed typeface, available only on your site, is a scoped piece of custom development.

How does the print file know which font was actually used?

Cmsmart Cloud renders the print-ready PDF from the same approved design the shopper saw, font and curve settings included, so nobody re-typesets the order by hand before production.

How long does it take to get a product selling with custom text?

Turning the designer on for one product with an existing template is usually same-day work. A full catalogue of text-ready templates, a custom font library, or bulk-personalization flows is a scoped project — request a quote with your product count and we'll size it.

Written by

Cmsmart Product Designer Plugin Engineer

Builds and supports the Cmsmart Product Designer (NBDesigner) for WooCommerce.

  • NBDesigner
  • WooCommerce
  • Product customizer
  • Release notes
More from this expert →