Let us see, how to display a discount bar on your product pages while creating a discount rule.

Once creating the discount rule, you can find this option to customize your discount badge at the end of every rule -> 

Show discount Bar:  You can enable or disable the discount bar for each of the rules you create.

Badge Backgroud color and Text color:
Choose the background and the text color to customize your discount bar.
Once selected, you can view the preview of the badge on left.

Badge Text:
Add your own texts that you want to show on the product pages.
You can use shortcode:
{{title}} -> To get the rule title,  
{{discount}} -> Discount (if percentage eg: 20% or Flat, Fixed Price eg:$20),   {{discounted_price}} -> Discounted Product Price,       

Display positions:

To choose in which position the discount bar to be displayed
Navigate to Settings tab -> Product -> Position to show discount bar

You can choose from the varioud position displays of the product page here:

Woocommerce before add to cart form
Woocommerce product meta end
Woocommerce product meta start
Woocommerce after add to cart form
Woocommerce after single product
Woocommerce before single product
Woocommerce after single product summary
Woocommerce before single product summary

Here are few examples of the display positions:

Woocommerce before add to cart form:

Woocommerce after add to cart form:

Woocommerce before single product:


Still unclear ?

Please submit a support request. We are always happy to assist you :)


Did this answer your question?