Shopify themes, liquid, logos, and UX
Hello, I am looking to change the compare to price to red on my shopify store. I have tried looking at other solutions but I think because our store codes are different, they don't work for me. I am using the venture theme.
Solved! Go to the solution
This is an accepted solution.
Great – thanks for the Update @gadjetsgalore!
Could you mark the post as the solution? Thank you!
Mario
@gadjetsgalore - if you don’t share your URL, we can only go by a vanilla Venture implementation. You can add the following CSS code - f.ex. to the end of your /assets/theme.(s)css(.liquid)-file:
/* product details */
.product-single__price--compare.product-single__price--compare {
color: #f00;
}
/* card */
.product-card__regular-price.product-card__regular-price {
color: #f00;
}
Hope this helps … Mario
https://www.sportsoutletexpress.com/ is my url
I copied and pasted the code at the bottom of my /assets/theme.(s)css(.liquid)-file:, and clicked preview and the compare to price was still gray. Please let me know if I can provide anything else you need to know.
@gadjetsgalore – did you save the file?
I checked the built css-source file at https://cdn.shopify.com/s/files/1/1363/4521/t/14/assets/theme.scss.css?v=2490729944409828148 and it does not contain the code above:
Mario
Hi Mario,
I revisited the code today and it works. Thank you very much for your detailed explanation!
This is an accepted solution.
Great – thanks for the Update @gadjetsgalore!
Could you mark the post as the solution? Thank you!
Mario
Accepted as solution! Worked great for me
Thank you @gadjetsgalore !
Hi Mario
if I want to switch the red to the current price and leave the compare to price gray, what do I have to change in my code?
/* product details */
.product-single__price--compare.product-single__price--compare {
color: #f00;
}
/* card */
.product-card__regular-price.product-card__regular-price {
color: #f00;
}
@gadjetsgalore – there you go …
/* product details */
.product-single__price--compare.product-single__price--compare {
color: #666;
}
.product-single__price.product-single__price {
color: #f00;
}
/* card */
.product-card__regular-price.product-card__regular-price {
color: #666;
}
.product-card__price.product-card__price {
color: #f00;
}
However, the regular price will ALWAYS be red, not just for the items on sale. If you want that changed, the theme needs to be modified a little.
Hope this helps,
Mario
Thank you Mario! This code worked great. What do I need to change in the code for the price to be gray?
Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024