Product badges in WooCommerce: Sale, New and Bestseller labels
By Mariusz Szatkowski · Updated: 2026-06-20
In a grid of similar products, the items that get clicked are the ones that stand out. Product badges are the cheapest way to make that happen: a small Sale, New or Bestseller label that catches the eye and gives the shopper a reason to look closer. This guide explains how badges work in WooCommerce, which ones actually move sales, and how to add them without hurting performance.
What Product Badges Are
A product badge is a small label placed on the product image, in listings and on the product page. Common badges include:
- Sale or a discount percentage, signalling a price cut
- New, marking recently added products
- Low stock, adding gentle scarcity
- Bestseller, adding social proof
Each one delivers a quick, glanceable message at the exact moment the shopper is scanning options.
Why They Lift Conversion
Badges work because shopping is fast and visual. A shopper scanning a category does not read every title; they look for cues. A well-placed badge gives one:
- Urgency from Sale and Low stock labels, nudging a decision.
- Reassurance from Bestseller, borrowing the confidence of other buyers.
- Freshness from New, pointing returning visitors at what changed.
The gain comes from relevance, not decoration. A badge that reflects something true about the product, shown where the eye lands, earns the click.
Automatic Beats Manual
The most useful badges run on rules so they stay accurate without constant editing:
- Sale appears whenever a product is discounted, and disappears when the sale ends.
- Low stock appears when inventory falls below a threshold.
- New appears for a set window after a product is published.
Manual badges cover the cases that are not rule-driven, like a hand-picked staff pick. Marks for WooCommerce supports both automatic and manual badges out of the box.
Keep Them Light
Because badges sit on every product image across busy listing pages, how they render matters:
- CSS-only. A badge is a label, so it does not need JavaScript. Rendering it with CSS adds no script to download and run.
- No layout shift. The badge should sit in reserved space so it never pushes the image or title as the page loads.
Marks renders its badges CSS-only with no JavaScript and no layout shift, which keeps listing pages fast. Scheduled campaign badges, conditional rules, image badges and A/B label sets are where Marks PRO extends the free plugin.
Marks Versus Default WooCommerce
Core WooCommerce shows only a single “Sale” flag on discounted items. Here is the difference for product badges specifically:
| Capability | Default WooCommerce | Marks |
|---|---|---|
| Badge types | Sale only | Sale, New, Low stock, Bestseller, custom |
| Automatic, rule-based badges | Sale only | Yes, multiple rules |
| Manual badges | No | Yes |
| Rendering | n/a | CSS-only, no JavaScript |
| Layout stability | n/a | No layout shift |
| Scheduling, conditional rules, A/B | No | Yes (PRO) |
| Cost | Free (core) | Free (GPL); PRO adds campaigns and image badges |
The Short Version
Product badges are a small, high-leverage addition: they make the right products stand out and give shoppers a reason to click. Prefer automatic, rule-based badges so they stay accurate, render them CSS-only to protect performance, and reach for scheduling and conditional rules when you run campaigns.