WooCommerce Product Designer Templates Setup Guide

Applies to Cmsmart Product Designer (formerly NBDesigner) 2.17.0 · Updated October 2026. Covers the WooCommerce Product Designer templates setup in three admin screens — Media > Template, Media > Template Tags and Media > Template Fields — plus how the result looks on the storefront.

In short

  • Template, Template Tags and Template Fields are the three admin screens that control which ready-made designs buyers see, how those designs are organized, and whether personal details fill in automatically.
  • Template holds the catalog and the Assign to products action, Template Tags groups templates into searchable categories, and Template Fields maps a template's text layers (plus an optional vCard QR code) to WordPress and WooCommerce customer data.
  • Setup takes an admin who can see Media > Template in wp-admin, a product with the Online Designer enabled, and about ten minutes to assign a first collection and check it on the storefront.

Why does an unorganized template library cost you orders and admin time?

Cmsmart Product Designer's template screens only pay off once they're configured: an un-tagged library is hard to search, a collection nobody assigned shows Products showing templates at zero, and unmapped Template Fields mean every buyer retypes details the account already has on file.

We see the same symptoms on stores that installed the plugin but never opened Media > Template:

  • A library nobody can search. Without Template Tags, 29 templates in 23 collections is just a long undifferentiated list, so the search box in the online designer's Templates panel comes up empty more often than it should.
  • Templates that exist but aren't live. A collection with no Assign to products action run against it never reaches the storefront — the Template library's own Products showing templates counter stays at zero even with a full catalog behind it.
  • Checkout friction from a blank canvas. Poor customization UX, including a buyer who opens the designer to an empty stage, is a direct contributor to the roughly 70% cart abandonment rate tracked across ecommerce in 2026 (Baymard Institute/Statista data via Contentsquare, 2026).
  • Retyped customer details on every order. With Template Fields left unmapped, a buyer personalizing a business card or badge retypes name, email, phone and company by hand, and the vCard QR option stays off so finished cards ship without a working contact.

Cmsmart insight: the stores that get the most out of the template screens aren't the ones with the biggest library — they tag collections by what a buyer searches for, then click Assign to products on the ones that matter. A 5-template tagged collection assigned to your top seller beats 29 templates assigned to nothing.

What does a well-tagged, fully assigned template library look like for your store?

Cmsmart Product Designer's template library, done right, means a buyer opens a product, picks Design here online, searches the Templates panel by a tag that actually matches their intent, drops in their own text, and, if the product uses Template Fields, sees their own name and company already filled in.

Example scenario. A print shop tags its badge collection Conference in Template Tags, assigns it to the badge product from the Template library, and maps the Template Fields Full Name, Email and Company to the matching WordPress and WooCommerce billing fields. A logged-in wholesale buyer opens the badge product, picks a template from that tag, and their account's name and company are already sitting in the text layers. They swap the photo, click Process, and the finished badge, QR vCard included, is in the cart in under a minute.

WooCommerce product designer plugin product page before a template is used, showing the Start and upload design button
Cmsmart Product Designer 2.17.0, storefront product page, before: a product page waiting for the buyer to start a design.

How does Cmsmart Product Designer's template system work?

Cmsmart Product Designer splits template setup across three admin screens — Template (the shared catalog), Template Tags (the taxonomy that organizes it) and Template Fields (the data mapping) — each in the Media menu group that 2.17.0 introduced, so one collection and one field map serve every product you attach them to.

Here's what each screen controls, confirmed against this store's live wp-admin on Cmsmart Product Designer 2.17.0:

WooCommerce product designer templates setup screen: Cmsmart Media Template library with Templates, Collections and Products showing templates counters and an Assign to products button
Cmsmart Product Designer 2.17.0, WP Admin > Cmsmart > Template: the global template library, searchable by tag, with an Assign to products action per collection.
Template setup fields, as shown in wp-admin on this store (Cmsmart Product Designer 2.17.0)
Screen / field (as shown)What it doesDefaultRecommended: print shop / POD apparel / B2BStorefront effect
Template > search box + category filter (e.g. Badge)Filters the 29-template, 23-collection library by name or tagNo filter appliedFilter by product type / garment or season / account tier's approved setsMirrors the same search box in the designer's Templates panel
Template > Assign to products (per collection)Pushes a collection to the products you pick, instead of rebuilding per productNot assigned (shows Products showing templates: 0)Assign to every high-traffic product / per garment category / only to the account's catalogMakes the collection appear in that product's Design here online > Templates panel
Template Tags > Name / Slug / DescriptionCreates a taxonomy term that groups templates for the search and filter boxes aboveAs installedTag by product type / by garment and season / by brand or programShows as the category label on each card and as a filter chip in the Templates panel
Template Tags > Featured (checkbox)Marks a tag so it can be surfaced ahead of the restUnchecked (sample tags all show no)Feature your best seller / feature the current season / feature the house tagChanges tag/filter ordering (theme-dependent)
Template Fields > Field Name → Connect field toMaps a template text layer (Full Name, Email, Phone, Website, Company, …) to a WordPress or WooCommerce Billing source, auto-filling it for a logged-in buyerAs installedMap Full Name/Email/Phone/Company / usually not needed / map Company and EmailPre-fills the matching text layer for a logged-in buyer
Template Fields > vCard mapping + Save vCardBuilds a scannable vCard (contact file) QR code from the mapped fieldsOff until enabled via the To enable vCard linkTurn on for business cards / not applicable / optional, for staff ID badgesAdds a QR code element to the finished design
WooCommerce product designer templates setup: Cmsmart Template Tags taxonomy screen with Name, Slug, Description, Featured and Thumbnail fields
Cmsmart Product Designer 2.17.0, WP Admin > Cmsmart > Template Tags: the taxonomy screen that organizes the library into searchable groups.
WooCommerce product designer templates setup: Cmsmart Template Fields mapping screen connecting Full Name, Email, Phone, Website and Company to WordPress and WooCommerce data, plus a vCard field map
Cmsmart Product Designer 2.17.0, WP Admin > Cmsmart > Template Fields: field mapping on the left, vCard QR mapping on the right.

What's deliberately not in these three screens: franchise-style template locking, automatic seasonal rotation, and mapping a field outside WordPress/WooCommerce. Those are real B2B and franchise requests — Cmsmart builds them as custom development (see Going further below).

What's the ROI of a well-organized Cmsmart Product Designer template library?

A correctly tagged, assigned and field-mapped template setup pays back in fewer abandoned design sessions, less manual admin work, and fewer support tickets about retyped customer details — all visible from the same Template and Orders screens Cmsmart Product Designer already gives you.

The underlying demand keeps growing: the global print-on-demand market was valued at $10.8 billion in 2025, projected to reach $13.1 billion in 2026 and grow at a 23.6% CAGR from 2026 to 2033. A findable, pre-filled template setup is how you handle more of that volume without adding design or support staff.

BenefitHow it shows up in your businessKPI to track
Findable templatesBuyers find a matching tag instead of scrolling an untagged listDesigner search → template selected rate
Templates that are actually liveAssigned collections show up in Products showing templates instead of sitting at 0Products showing templates (Template library stat)
Less manual data entryLogged-in buyers see pre-filled Template Fields instead of retyping detailsSupport tickets about auto-fill, per month
Fewer abandoned design sessionsBuyers who open the designer actually finish and add to cartDesigner-opened → Add-to-cart rate

Rough-cut ROI worksheet. Take your own numbers: (orders/month using a template-enabled product) × (minutes of admin time saved per order now that Assign to products replaces manual placement) × (your loaded hourly rate ÷ 60) = monthly admin time saved. Add: (orders/month from mapped accounts) × (minutes of retyped-detail support avoided) for the support-time side.

How do you complete your WooCommerce Product Designer templates setup?

Cmsmart Product Designer lets you configure templates end to end in wp-admin: tag your collections in Template Tags, build and assign the catalog in Template, map personalization fields in Template Fields, then confirm the result from the storefront chooser.

Here's how to configure it, start to finish, using the Media menu group that 2.17.0 introduced:

  1. In wp-admin, confirm you're on Cmsmart Product Designer 2.17.0 or later under Plugins — the Media menu group (Template, Template Tags, Cliparts, Fonts, Backgrounds) ships from this release.
  2. Open Media > Template Tags and use Add New Template tag to create the categories your buyers actually search for (by product type, occasion or season) — each tag gets a Name, Slug, optional Description and a Featured checkbox.
  3. Open Media > Template to see the library: check the Templates, Collections and Products showing templates counters, then use the search box and category filter to find the collection you want to publish.
  4. Click Assign to products on that collection and pick the products that should offer it — this is the step that moves Products showing templates off zero.
  5. If the template personalizes a buyer's own details (business cards, badges), open Media > Template Fields and map each Field Name (Full Name, Email, Phone, Website, Company, …) to the matching WordPress or WooCommerce Billing source, then Save fields.
  6. Optionally use the To enable vCard link on the same screen, map the vCard fields and click Save vCard so finished designs can carry a scannable contact QR code.
  7. Confirm the product itself has the Online Designer enabled — a template only shows once both the assignment and the designer toggle are on.
  8. On the storefront, open the product as a buyer would: the chooser offers Upload a full design or Design here online.
  9. Pick Design here online, then use the designer's Templates tab and its search box to find the tag you just assigned and load the template on the canvas.
  10. Click Process to render the design; it appears as Your artwork on the product page and carries through to the cart and checkout like any other design, then goes to Cmsmart Cloud for rendering, which still produces a print-ready PDF that matches the order.
WooCommerce product designer templates setup: storefront chooser offering Upload a full design or Design here online
Cmsmart Product Designer 2.17.0, storefront: the chooser a buyer sees before reaching the template-enabled canvas.
WooCommerce product designer templates setup: online designer Templates panel with a ready-made invitation template loaded on the canvas
Cmsmart Product Designer 2.17.0, online designer: the Templates panel and search box, with a template already loaded from an assigned collection.
WooCommerce product designer templates setup: product page after processing, showing the finished design as Your artwork next to Add to cart
Cmsmart Product Designer 2.17.0, storefront product page, after: the processed template shows as Your artwork next to Add to cart.

Common mistakes and troubleshooting: check Products showing templates first if a template doesn't appear on the storefront — an unassigned collection never shows, even with the Online Designer enabled. If a Template Field doesn't pre-fill, confirm the buyer is logged in and that Connect field to matches a field their account actually has data in. A Featured tag that doesn't jump to the front of the list is a theme/display question, not a broken setting. Deep settings for upload types, DPI and output format live in the Cmsmart Product Designer settings guide.

Going further: what custom development can Cmsmart build on your template setup?

Beyond the three Media screens, Cmsmart builds custom development for stores that need rules the core plugin doesn't ship with — franchise brand locking, bulk personalization from a spreadsheet, or fields synced from a system outside WordPress and WooCommerce.

Common requests, and what we build:

  • Franchise/location-locked collections. A permissions layer on top of Template Tags and Assign to products so a location can personalize editable fields but can't touch locked brand elements.
  • Bulk-personalized badges from a spreadsheet. An event organizer uploads a guest list and gets the same template rendered once per row — name, company and a vCard QR per badge.
  • Field mapping to an external CRM or MIS. Cmsmart builds the integration layer that pulls Template Fields data from an outside CRM, membership system or MIS.
  • ERP/MIS-synced collection rotation. Seasonal collections that swap their Assign to products targets automatically on a schedule, driven from your MIS.
  • Marketplace template catalogs. For multi-vendor stores, Cmsmart builds vendor-specific tag sets so each seller's buyers only see that seller's approved collections.

Delivery follows one path: discovery call → solution design → build sprints → QA → launch → support, the same model behind the case studies on our ecommerce project delivery page, and detailed on our product designer customization service page.

Get a custom template setup quote

Why work with Cmsmart on your product designer template setup?

Cmsmart has built and supported Cmsmart Product Designer (NBDesigner) since 2012 as a division of Netbase JSC, with thousands of client projects delivered and the same Template, Template Tags and Template Fields screens shipping in the plugin every store already runs.

Cmsmart has delivered 6,300+ client projects since 2012, with 4,600+ projects delivered and 1,800+ live stores running today across 80+ countries. Reviews on Trustpilot average 4.2 out of 5 from 404 reviews, including from buyers of the template library itself:

"My first time with this developer and am very impressed with the template that I purchased and the quick turnaround and assistance." — Lillian Fidler, Trustpilot review

See related work on our projects page. If you're assigning collections across a wider catalog, see how the global template store feeds that catalog; if your products need configurable components rather than a single flat layout, see building components with Product Builder. For the full setup picture, start from the installation and setup hub.

Frequently asked questions

Do I need a separate plugin for WooCommerce Product Designer templates setup?

No. Template, Template Tags and Template Fields all ship inside Cmsmart Product Designer (NBDesigner) 2.17.0 under the Media admin menu group — there's nothing extra to install.

Why does the Products showing templates counter stay at 0 after I add templates?

That counter only moves once you run Assign to products on a collection. Adding templates to the library and tagging them doesn't publish them to any product by itself — assignment is the step that does.

Do Template Fields work for guest checkout, or only logged-in buyers?

The mapping pulls from WordPress and WooCommerce account data, so it fills in for a logged-in buyer whose account has that data. A guest checkout has no account record to pull from, so the field stays blank for them to fill in by hand.

Can I use Template Fields mapping without turning on the vCard QR code?

Yes. The field mapping table and the vCard mapping are separate: you can map Full Name, Email and the rest to pre-fill text layers without ever using the To enable vCard link.

What does the Featured checkbox on a Template tag actually change?

It marks that tag so it can be surfaced ahead of the rest in the tag list; on this store none of the sample tags are marked Featured, so the practical effect depends on how your theme and the Templates panel order featured tags.

Can Cmsmart build field mapping to our own CRM or MIS instead of just WordPress/WooCommerce?

Yes — that's custom development, not a core feature. Cmsmart builds integrations that pull Template Fields data from an external CRM or MIS, plus franchise-level collection locking and bulk, spreadsheet-driven personalization; see the going-further section above.