# Product badges

**Product badges** are labels that appear on listed products that are on **Sale**, **Sold out**, or you can add **Custom** badges.

<details>

<summary><mark style="color:blue;"><strong>Why are custom badges not showing?</strong></mark></summary>

Make sure the badge tags match the exact spelling of the product tags in your Shopify admin. Also, check that the **Show custom badges** option is enabled in *Theme settings > Product listing*.

</details>

## Show badges on product listings

***

Sale, sold out, and custom badges are enabled by default. You can toggle off badges and change their **position** on product cards.

`Go to Theme settings > Product listing to find settings`

<table><thead><tr><th width="225">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Show "Sale" badge</mark></td><td>Show badges for products on sale.</td></tr><tr><td><mark style="color:blue;">Show "Sold-out" badge</mark></td><td>Show badges for products with no stock.</td></tr><tr><td><mark style="color:blue;">Show "New" badge</mark></td><td>Show badges for products in ‘new’ collections or recently published.</td></tr><tr><td><mark style="color:blue;">Show custom badges</mark></td><td>Show custom badges created in the Product badges theme settings.<br><br>Learn how to <a href="product-badges">set up custom product badges</a>.</td></tr><tr><td><mark style="color:blue;">Position</mark></td><td>Display all badges in the <strong>Top left, Top right, Bottom left,</strong> or <strong>Bottom right</strong>.</td></tr></tbody></table>

## Sale badge

***

When you set sale prices in your Shopify admin, products will display a **Sale badge** with a "sale" or discount message.

{% hint style="success" %}
Product discounts is a Shopify feature. Learn about [Setting sale prices](https://help.shopify.com/en/manual/discounts/sales) and [Managing inventory](https://help.shopify.com/en/manual/products/inventory) on Shopify.
{% endhint %}

`Go to Theme settings > Product badges to find settings`

<table><thead><tr><th width="171">Setting</th><th width="428">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Color</mark></td><td>Set the color of the badge background and text.</td><td></td></tr><tr><td><mark style="color:blue;">Sale badge format</mark></td><td>Display discounts as a percentage or dollar value, or simply show a "Sale" text label.</td><td><strong>Sale</strong><br><strong>20% off</strong><br><strong>-20%</strong><br><strong>Save 20%</strong><br><strong>$5 off</strong><br><strong>-$5</strong><br><strong>Save $5</strong></td></tr></tbody></table>

## Sold out badges

***

When products are out-of-stock, products will display a "Sold out" badge.

To disable sale or sold-out badges, click **Theme settings** and open the Product listing tab.

{% hint style="success" %}
Product inventory is a Shopify feature. Learn about [Managing inventory](https://help.shopify.com/en/manual/products/inventory) on Shopify.
{% endhint %}

`Go to Theme settings > Product badges to find settings`

<table><thead><tr><th width="199">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Background color</mark></td><td>Set the color of the badge background.</td></tr><tr><td><mark style="color:blue;">Text color</mark></td><td>Set the color of the "sale" and discount message.</td></tr></tbody></table>

## New badges

***

Show a “New” badge on products that have been recently added to your store or are included in a collection for new products.

<details>

<summary><mark style="color:blue;">STEPS</mark></summary>

In your theme editor (**Customize**):

1. Click the **Theme settings** ’gear’ icon.
2. Click to open the **Product badges** tab.
3. Use the color picker to select the **Background** and **Text** colors for the “New” badge.
4. Choose a **“New” badge product source** to determine when to show the “New” badge.

   > Select **Collection** to display the “New” badge for products included in a collection.

   > Select **Automatic** to display the badge for a specified number of days after products have been published. Use the **Duration in days** slider to set the number of days between **1** and **50**.
5. Click **Save**

</details>

`Go to Theme settings > Product badges to find settings`

<table><thead><tr><th width="199">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Background color</mark></td><td>Set the color of the badge background.</td></tr><tr><td><mark style="color:blue;">Text color</mark></td><td>Set the color of the "sale" and discount message.</td></tr><tr><td><mark style="color:blue;">"New" badge product source</mark></td><td><p>Choose when to display a "new" badge<br><br><strong>Collection</strong> displays the “New” badge for products included in a collection.<br></p><p><strong>Automatic</strong> to display the badge for a specified number of days after products have been published.</p></td></tr><tr><td><mark style="color:blue;">New badge collection</mark></td><td>If <strong>Collection</strong> is selected, choose a collection of new products that you've created in your Shopify admin.</td></tr><tr><td><mark style="color:blue;">Duration in days</mark></td><td>If <strong>Automatic</strong> is selected<strong>,</strong> set the number of days from a product's published date that the new badge should appear.</td></tr></tbody></table>

## Custom badges

***

Add up to 4 custom badges to display on products that have the badge tag added in the Shopify admin. For example, add a badge for "New arrivals" or "Limited editions".

{% stepper %}
{% step %}
In **theme settings > product badges**, enter words in **Badge tags** want to display as a badge (e.g. "Limited edition").

> Use the color selector to change the **Badge color**.
> {% endstep %}

{% step %}
In your **Shopify admin**, add tags to your products using the exact same words.

> Learn more about [creating and using tags](https://help.shopify.com/en/manual/shopify-admin/productivity-tools/using-tags) on Shopify.\
> \
> To use badge colors for multiple tags, enter the tags in a comma-separated list. For example: `Best seller, New, Special`.
> {% endstep %}
> {% endstepper %}

`Go to Theme settings > Product badges to find settings`

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Badge tags</mark></td><td>Enter the words to display as the product badge.<br><br>For badges to appear, badge tags must match the product tags entered in your Shopify admin.</td></tr><tr><td><mark style="color:blue;">Badge color</mark></td><td>Set the color of the custom badge.</td></tr><tr><td><mark style="color:blue;">Style</mark></td><td>Choose to display badge labels in <strong>Uppercase</strong> text.</td></tr></tbody></table>

***

> **Related links**
>
> [Product listings](https://help.fluorescent.co/cornerstone/products/product-listings)\
> [Product listing style](https://help.fluorescent.co/cornerstone/products/product-listings/layout-and-style)\
> [Product card details](https://help.fluorescent.co/cornerstone/products/product-listings/product-card-details)\
> [Quick view](https://github.com/fluorescent/kb-cornerstone/blob/main/products/broken-reference/README.md)\
> [Quick add](https://help.fluorescent.co/cornerstone/products/quick-shop)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.fluorescent.co/cornerstone/products/product-badges.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
