> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://regiostech.crisp.help/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Discount Badges FAQ

![Screenshot of a badge, surrounded in red](https://storage.crisp.chat/users/helpdesk/website/d13e90de659a8800/image_9psr7n.png)

When [displaying discounts on product pages](/en/article/how-to-display-discounts-on-product-pages-1sj49lh/), our app can also edit the contents of sale/discount badges.

Badges signal to users that an item is on sale. For example, in most themes, if a product has a compare-at price, a badge is shown.

# IMPORTANT
* The badge settings discussed in this article only affect discounts displayed by our "discount on product page" (DOPP) feature. For example, you can use this functionality to customize badges on product/collection/search pages and related/complementary products sections.
* If you want to display discounts badges on line items in your cart, you will need to write your own custom Liquid code. **Our app does not control the HTML of line items on your cart page. Your theme's code does that.**

# How to Edit Badge Content
The "Discounts Embed" app block has a "Badge description" setting. It is an HTML text input. You can use [Discount Description Templates](/en/article/discount-description-templates-1v96yl2/) to edit the contents; our app will dynamically fill in values like the discount percentage or amount.

If you don't want the app to edit badges, clear the text field.

For example, you can make the badge display the discount percentage by providing `[discount_percentage] OFF` as the value.

# Getting Badge Contents Dynamically in JavaScript
For more complex integrations, you can use our app's [DOPP API](/en/article/dopp-api-reference-1gvya0h/) to dynamically calculate discounted prices in JavaScript.

The result of `calculateDiscountedPrices` will have a `badge` field. This object contains `html` and `css` strings you can insert into your desired elements.

Here's some example code:

```
const {description, badge} = await window.RegiosDOPP.api.v0.productPage.calculateDiscountedPrices();
document.querySelector('.badge').innerHTML = badge.html;
document.querySelector('.badge').cssText = badge.css;
```

# Your Feedback Matters
Your review helps keep this small business running. Please [leave one](https://apps.shopify.com/regios-automatic-discounts#modal-show=ReviewListingModal) on the Shopify App Store.