![]()
Hello,
I’d like to change the content of the “Sale” button on my product page to show the % discount I’m applying.
I’m not familiar with coding and I’m using the Spotlight theme.
Thanks for your help.
![]()
Hello,
I’d like to change the content of the “Sale” button on my product page to show the % discount I’m applying.
I’m not familiar with coding and I’m using the Spotlight theme.
Thanks for your help.
Hey @Elies216
Firstly, a warm welcome to the community. Could you please add us as a collaborator account to edit the theme code?
https://help.shopify.com/en/manual/your-account/staff-accounts/collaborator-accounts
DM me the collaborator code and we’ll get this fixed for you. Also send over the link to your store.
@Elies216 Hey, thanks for posting here.
can you please use this code?
{% assign original_price = product.price %}
{% assign sale_price = product.compare_at_price %}
{% if sale_price > original_price %}
{% assign discount = sale_price | minus: original_price %}
{% assign discount_percentage = discount | times: 100 | divided_by: sale_price | round %}
Save {{ discount_percentage }}%!
{% endif %}
I hope it will help you; otherwise, contact me. Thanks.
Hi @Elies216
You can follow my post to do that
https://buymeacoffee.com/dandong910/change-sale-badge-text-percentage-discount-shopify-free-themes
Hi @Elies216 ,
As you don’t know how to code, I suggest using a product badge app on Shopify App Store. I can recommend the Fordeer Product Labels & Badges app. I will guide you on how to proceed for free.
Step 1: Install and embed the app.
Step 2: Create a text badge. In the text content section, click on the ellipsis and select variables, then choose {discount_percentage}.
The app will automatically calculate and display based on the compare at price and the price you initially set.
Step 3: In the general settings section, select the page where you wish to display your badge: product pages