How to change the compare at price from "sale $xxx off" to "compare at $xxx"

bicyclebiz
Tourist
3 0 1

My site is running on the pipeline theme 6.2.1 and I would like to change the compare at price from displaying as "sale $xxx off" to "compare at $xxx" with the compare price using strikethrough.

 

Any help appreciated!

Replies 11 (11)

KetanKumar
Shopify Partner
36839 3635 11972

@bicyclebiz 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
bicyclebiz
Tourist
3 0 1

@KetanKumar  URL is logoscomponents.com

Niki_K
Shopify Partner
447 45 124

Hey @bicyclebiz.

 

You will need to go into the code and edit the text and change what price should be rendered there.

I'm not sure how the file is called in the Pipeline theme, but you'll need to find the relevant product-template file and find the section with the prices.

 

Then, search for this class:

class="product__price--off"

 Change the content in the <span></span> tag and also change what price should be rendered there.

 

Hope this helps!

Send me a link to your store to niki@ecommercepot.com and I'll help you out.
For more info what I do, visit my agency website ecommercepot.com or my personal website nikikozak.me.
bicyclebiz
Tourist
3 0 1

Thanks for your response @Niki_K I had found that, but am not sure what parameter to swap in to change it to compare at. Where wouldI be able to find the variable that I need to enter to replace "data-price-off-type" and "data-price-off-amount"

Screen Shot 2022-09-26 at 11.14.33 AM.pngScreen Shot 2022-09-26 at 11.12.12 AM.png

Niki_K
Shopify Partner
447 45 124

Hey @bicyclebiz,

 

alright, please follow these steps.

 

Just to make sure we're on the same page – you would like to display the sale as follows (the price is just for example purposes):

 

Snímek obrazovky 2022-09-26 v 21.18.41.png

If yes, please do these changes to your code. You can get rid of the "Sale" text at the beginning and the center dot as well.

 

 

HTML/LIQUID
<span data-price-off class="product__price--off hide">
  {{'products.product.compare' | t }} <!-- you'll need to add this translation or just use 'Compare at' instead. -->
  <span data-price-off-amount class="strike-through"> 
    {{ current_variant.compare_at_price | money }}
  </span>
</span>

CSS
.strike-through {
text-decoration: line-through;
}

 

 

I think this could be working – since I don't have access to the theme's source code, I can't test it first before sharing the piece of code with you. I'll be happy to help you further if there are any issues (I suspect some CSS issues might show up).

 

Hope this helps!

Send me a link to your store to niki@ecommercepot.com and I'll help you out.
For more info what I do, visit my agency website ecommercepot.com or my personal website nikikozak.me.
EmilyLoftman
Tourist
16 0 2

Hi, could you help me with a similar problem?

 

I would like to change my compare at price wording. It says 'sale' and I'd like it to say 'Pre-Launch Discount"

 

Screenshot 2023-03-10 at 14.06.41.png

Niki_K
Shopify Partner
447 45 124

Hi @EmilyLoftman,

 

will you share the store's URL, please?

 

Thanks!

Send me a link to your store to niki@ecommercepot.com and I'll help you out.
For more info what I do, visit my agency website ecommercepot.com or my personal website nikikozak.me.
EmilyLoftman
Tourist
16 0 2

Hey, I have emailed you with the password as the store is locked. Thanks!

Niki_K
Shopify Partner
447 45 124

Hey @EmilyLoftman,

 

thanks! I think the easiest no-code way how to change the text from "Sale" to "Pre-launch discount" is to do it via translations:

 

1. Go to your Shopify admin.

2. Next to the theme, you would like to make the changes for, click the three dots.

3. A dropdown menu opens, select "Edit default theme content".

4. Choose "Products" from the top bar menu.

5. There is a list of short phrases that can be translated. Find the "On sale".

6. Rewrite the content to "Pre-launch discount".

7. Save the changes, open you store (refresh it if needed). You should see the content changed.

 

Here are some screenshots:

Snímek obrazovky 2023-03-12 v 13.54.50.png

Snímek obrazovky 2023-03-12 v 13.55.24.png

Snímek obrazovky 2023-03-12 v 13.53.23.png

 Let me know if it works.

Send me a link to your store to niki@ecommercepot.com and I'll help you out.
For more info what I do, visit my agency website ecommercepot.com or my personal website nikikozak.me.
EmilyLoftman
Tourist
16 0 2

Hi Niki,

 

That's worked perfectly! Can't believe the solution was so simple! 

 

Thank you!!

luisaraujo
New Member
5 0 0

i have a similar problem to this however I want to change the text SALE into the discount percentage= anyone know how to do that