> For the complete documentation index, see [llms.txt](https://analog.groupthought.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://analog.groupthought.com/features/merchandising.md).

# Badges, ratings & preorder

How Analog renders sale, sold-out, and custom badges, star ratings, and preorder products.

Analog renders badges, ratings, and preorder state from Shopify data or metafields. It doesn't include a reviews system or separate inventory logic.

## Data sources

Sold-out and sale badges use Shopify product data. The other signals use metafields named under Theme settings › Metafields. See the [metafields reference](/reference/metafields.md) for keys and data shapes. Apps and Shopify Flow can update the fields without changing the theme.

| Signal         | Source                                   | Level               |
| -------------- | ---------------------------------------- | ------------------- |
| Sold-out badge | Variant availability                     | Variant             |
| Sale badge     | Compare-at price above price             | Variant             |
| Custom badge   | The "Badges" metafield                   | Product and variant |
| Star rating    | The standard `reviews.rating` metafields | Product             |
| Preorder       | The "Product preorder" boolean metafield | Product             |

## Badges

Card badges render in one row over the product image. Their order is sold-out, sale, product custom badges, variant custom badges, then star rating when it is grouped with badges. Theme settings › Cards › Badges controls the background, text, typography, and rounding for all of them.

### Automatic badges

"Show sold out badges" and "Show sale badges" are on by default. "Sale badge style" picks what the sale badge says:

| Option  | Output                                    |
| ------- | ----------------------------------------- |
| "% off" | The computed percentage, rounded down     |
| "$ off" | The amount saved, without a currency code |
| "Label" | A plain "Sale" label                      |

When prices vary across variants, "% off" and "$ off" fall back to the plain "Sale" label because there isn't one accurate discount for the product. Discounts below 1% also use the plain label. "Set sale color" gives the sale badge a separate background and text color.

### Custom badges

Name a single-line text metafield under Theme settings › Metafields › "Badges". A single value renders one badge. A list renders one badge per value. Analog reads the same key from the product and variant, so one variant can show "Low stock" or "Final sale" without adding the badge to its siblings.

Badge values are plain text. HTML is removed. An inventory app or Flow automation can write "Low stock" below a threshold and clear the value on restock.

Use the standalone Badge block for a hand-placed badge with custom fill, border, blur, rounding, or typography. Use the metafield for labels that should follow catalog data.

## Star ratings

Analog displays ratings but doesn't collect reviews. It reads Shopify's standard `reviews.rating` and `reviews.rating_count` metafields. Review apps such as Judge.me, Okendo, Yotpo, and Loox can fill them. Products without those values don't show a rating.

The display uses one filled star followed by the numeric value. Enable the count to add it in parentheses. Analog doesn't render a row of five stars.

Under theme settings › Cards › "Star rating": "Show star rating" (off by default), "Group with" places it in the "Badges" stack over the image or with the "Product details" below, and "Show rating count" appends the count.

{% hint style="info" %}
The theme editor shows placeholder data (4.5 from 21 reviews) so you can style the rating before an app writes real values. Products with no rating are hidden on the live storefront.
{% endhint %}

## Preorder

Preorder changes the add-to-cart label and cart data. It doesn't change inventory. Name a boolean metafield under Theme settings › Metafields › "Product preorder". When it is true on an available product:

1. The add-to-cart button label changes to "Pre-order".
2. The cart line gets a "Sale type: Pre-order" property, visible in the cart, at checkout, and on the order.

Change both labels in the theme translations. There is no inventory gating, ship-date logic, or automatic change when stock runs out. A sold-out variant still shows "Sold out". Shopify Flow can set the boolean before a release and clear it on launch day.

## Recipes

### Percent-off sale badges in red

Use the computed style with a dedicated sale color for loud markdowns:

* Theme settings › Cards › Badges › Show sale badges: on
* Badges › Sale badge style: "% off"
* Badges › Set sale color: on, with a red background and dark red text

### Automated low-stock badges

Use a text metafield that an automation writes, so badges follow inventory:

* Theme settings › Metafields › Badges: `theme.badge`
* A Flow automation writes "Low stock" below a threshold and clears it on restock

### App-fed star ratings on cards

Use the standard review metafields your reviews app already writes:

* Theme settings › Cards › Star rating › Show star rating: on
* Star rating › Group with: "Badges"
* Star rating › Show rating count: on

### Preorder a coming-soon product

Use the boolean flag to take orders before launch:

* Theme settings › Metafields › Product preorder: `theme.preorder`
* Set the metafield to true on the product; clear it when stock ships normally

## See also

* [Metafields reference](/reference/metafields.md): badge and preorder data contracts
* [Siblings & grouped variants](/features/variants.md): variant data and sibling swatches
* [Cart page, drawer & conversion](/features/cart.md): preorder line item properties
* [Card sections](/building-pages/cards.md): cards that render these labels