When you put a product on sale for a lower price so that customers can see how the prices compare, our product details, also known as the compare at price, must include a sale price and the original price in order to show a sale price in your online store.
In this blog, we show you how to add and compare prices on the cart page.
Follow the steps Shopify admin > Themes > Three dots > Edit code
Search the main-cart-items. liquid file in Sections
Then, after searching the below code
<div class=”product-option”> {{ item.original_price | money }} </div> |
replace this code
<div class=”product-option”> {%- if item.original_price == item.variant.compare_at_price -%} {{ item.original_price | money }} {%- else -%} <span class=”price-compare”> {{ item.variant.compare_at_price | money }} </span> <span class=”price-origin”> {{ item.original_price | money }} </span> {%- endif -%} </div> |
Then paste the below CSS according to your required positions.
.product-option .price-compare { text-decoration: line-through; margin-right: 4px; } .product-option .price-origin { color: #FF1111; } |
Click on the save button.