To customize the appearance of discounts on product pages, you need to edit the CSS of the app blocks you are using.

For example, if you want to change the color of discounts on product pages, you would need to provide color: red as a setting to one of the blocks.

Which instructions to use depends on which app blocks you are trying to customize:

Discounts Embed (new DOPP)

You can find CSS options in the "Discount Embed" app embed settings. They are explained in this article.

If you're using the Discounted Price app block, you can find CSS styling instructions in the Discounted Price Block article.

Discounted Price Block (old DOPP)

The Discounted Price app block itself has settings that can be used to add CSS rules, and the "Additional CSS Customizations" section of the article explains which CSS selectors to use if you want to add more complex styles to your site's CSS files.

Your Feedback Matters

As a solo founder, your experience is crucial to me. Could you spare a moment to share your thoughts? Please leave a review on the Shopify App Store. Thank you for helping me improve!

Updated on: 03/11/2024