FROM CACHE - en_header
Promotion image

We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

How can i move " Sale " label badge to TOP Right and change Sale label to xx%

How can i move " Sale " label badge to TOP Right and change Sale label to xx%

mr_Lynk
Excursionist
28 0 3
‎02-19-2024 10:15 PM

Hi guys

pls help me move " Sale " label badge to TOP Right and change Sale label to xx%

i tried some code but it not work.

thank you for support me

Labels:
1,891 Views
0 Likes
Report
Replies 18 (18)

mr_Lynk
Excursionist
28 0 3
‎02-19-2024 10:16 PM

pls support me.

 

1,890 Views
0 Likes
Report

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎02-19-2024 10:24 PM

Hi @mr_Lynk 

Please share your store URL

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

1,880 Views
1 Like
Report
In response to Dan-From-Ryviu

mr_Lynk
Excursionist
28 0 3
‎02-19-2024 10:29 PM

https://q6b8qsir9nm1dny6-85507440942.shopifypreview.com

here you are.

1,877 Views
0 Likes
Report
In response to mr_Lynk

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎02-19-2024 10:41 PM

You can move label to top right from Online Store > Themes > Customize > Collections > Product grid > Theme settings > change option Position on cards

Screenshot 2024-02-20 at 10.34.02.png

Then go Online Store > Themes > Edit code > open card-product.liquid file, and find this line of code around line 135 

 

{{- 'products.product.on_sale' | t -}}

 

Replace it with this code and save file

 

{{ card_product.compare_at_price_max | minus: card_product.price | times: 100.0 | divided_by: card_product.compare_at_price_max | money_without_currency | times: 100 | remove: '.0'}}%

 

 

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

1,862 Views
1 Like
Report
In response to Dan-From-Ryviu

mr_Lynk
Excursionist
28 0 3
‎02-20-2024 12:08 AM

thank for support. i already change but i wanna add minus
Ex: -50%

and i want to change color is red or any color i choose

1,828 Views
0 Likes
Report
In response to mr_Lynk

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎02-20-2024 12:12 AM
- You can chang the color next option to chang position but I recommend you
create a new color scheme so it wont affect other element.
- Please a “-“ before the code I sent you.

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

1,824 Views
0 Likes
Report
In response to Dan-From-Ryviu

mr_Lynk
Excursionist
28 0 3
‎02-20-2024 12:37 AM

can you change help me box size. i want it smaller 

mr_Lynk_0-1708407333829.png

 

1,818 Views
0 Likes
Report
In response to mr_Lynk

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎02-20-2024 03:13 AM

You can do that by adding this code to theme.liquid file after <head> in Online Store > Themes > Edit code 

<style>
.badge { padding: 0.5rem 0.8rem 0.5rem !important; }
</style>

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

1,807 Views
1 Like
Report
In response to Dan-From-Ryviu

mr_Lynk
Excursionist
28 0 3
‎02-20-2024 04:23 AM

yes. It worked well

thank you so much

1,775 Views
1 Like
Report
In response to mr_Lynk

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎02-20-2024 04:24 AM

You are most welcome.

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

1,774 Views
1 Like
Report
In response to Dan-From-Ryviu

Rosa-Elysian
New Member
4 0 0
‎12-02-2024 09:17 AM

Hey,

 

I did this and it worked, except it shows -0%? (while the price is discounted, the original price is crossed out).

975 Views
0 Likes
Report
In response to Rosa-Elysian

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎12-02-2024 10:14 AM

Could you share your store URL?

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

966 Views
0 Likes
Report
In response to Rosa-Elysian

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎12-02-2024 10:16 AM

Please try to update the code to this and check again. 

{{ card_product.compare_at_price_max | minus: card_product.price | times: 100.0 | divided_by: card_product.compare_at_price_max | money_without_currency | times: 100 }}%

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

966 Views
0 Likes
Report
In response to Dan-From-Ryviu

Rosa-Elysian
New Member
4 0 0
‎12-02-2024 01:01 PM

Still shows 0%. the url is: rosa-elysian.com. I currently just renamed the sale badge to -30% at the theme content haha. But i need it to be automaticly

956 Views
0 Likes
Report
In response to Rosa-Elysian

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎12-02-2024 08:26 PM

Hi @Rosa-Elysian 

I used the code on my Dawn 15.2.0, and it worked well. Could you add the code and take a screenshot where did you add code so I can check? 

Screenshot 2024-12-03 at 08.25.16.png

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

947 Views
0 Likes
Report
In response to Dan-From-Ryviu

Rosa-Elysian
New Member
4 0 0
‎12-03-2024 10:18 AM

I can't upload the screenshot i took, it doesnt support .jpg. But i found the exact code you provided at line 140, deleted that and replaced it with your code. Maybe it's because i use the radient theme? (shouldnt be a problem i guess since its dawn based)?

931 Views
0 Likes
Report
In response to Rosa-Elysian

Dan-From-Ryviu
Shopify Partner
12073 2359 2539
‎12-03-2024 09:41 PM

So please try to use this code instead 

 

{{ product.compare_at_price_max | minus: product.price | times: 100.0 | divided_by: product.compare_at_price_max | money_without_currency | times: 100 | round }}%

 

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Collect customer reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

904 Views
0 Likes
Report
In response to Dan-From-Ryviu

Rosa-Elysian
New Member
4 0 0
‎12-04-2024 10:15 AM

still shows 0% if i add the new code.. 

888 Views
0 Likes
Report
Terms of Service Privacy Policy