> For the complete documentation index, see [llms.txt](https://foxecom.gitbook.io/zest-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://foxecom.gitbook.io/zest-theme/faqs/generic/add-custom-badges-to-the-product-card-and-product-page.md).

# Add custom badges to the product card and product page

Product badges help draw the attention of visitors to specific characteristics of the products. 

To set up the custom badges in Zest, simply add the supported product tags you want to display to your product:

```
tag__hot_[DISPLAY TEXT]
tag__new_[DISPLAY TEXT]
tag__sale_[DISPLAY TEXT]
```

<figure><img src="/files/Mt1LTpCVNhOa8B54D21t" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
Once the supported tags are added in Shopify admin, the product cards will show the custom badges automatically.
{% endhint %}

Below are examples of them on product cards:

{% tabs %}
{% tab title="tag\_\_hot\_HOT" %}

<figure><img src="/files/zEYlHHYf7UhpPlvwKszN" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="tag\_\_new\_NEW" %}

<figure><img src="/files/pP5LcDtuOZY2Y0SLck2t" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="tag\_\_sale\_SALE" %}

<figure><img src="/files/5V0F84S9PJpxsnlQkw22" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

{% hint style="success" %}
To add custom tags for product details page:

1. Go to **Product template** and locate the section **Product information**.
2. Add block **Custom tags**.
   {% endhint %}

<figure><img src="/files/4inm06umB1JuqcO2RePc" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
To change the custom badges' colors, go to **Theme settings > Colors**.

![](/files/XRDKWqmRHYIgX95RORff)
{% endhint %}