Change 'on sale' badge text to percentage discount

Store Design
11

Thanks! This works well on the images of collection pages, but how can I do the same on the product page? I mean, the sales badge that appear on the right of the product price.