Show compare at price on product page

Store Design
, , , , , , ,
1

Hi,

I want to show my compare at price eithe strike through on product page next to the price. My site is https://lux360.net/products/burberry-shirts-blue-8073216a1960-p24

D4C738DF-CC62-49D6-801B-5C6728C1DFD3.jpeg
D4C738DF-CC62-49D6-801B-5C6728C1DFD3.jpeg1170Ă—2532 113 KB

1 Like
2

Hello @Luxluxlux360

You’ll need to make some adjustments to your theme’s code. Here’s how to do it:

Go to your theme’s code:

In your Shopify admin, go to Online Store > Themes.
Find the theme you want to edit and click on Actions > Edit code.

Locate the product template:

Look for the file that controls the product page template. It’s usually named something like product.liquid or found under the Sections folder (e.g., product-template.liquid).

Insert the Compare at Price code:

Find where the product price is displayed. You should see code similar to {{ product.price | money }} or a price class.

Add the following code to display the “Compare at price” next to the main price, with a strike-through style:

{% if product.compare_at_price > product.price %}

{{ product.compare_at_price | money }}

{% endif %}
{{ product.price | money }}

Style the Compare at Price (Optional):

To customize the appearance of the “Compare at price,” add some CSS to your theme’s stylesheet. Locate the CSS file theme.css and add:

.compare-at-price {
font-size: 0.9em;
margin-right: 5px;
}

Note: If you’re not familiar with coding, you can grant me access to your store, and I’ll make the changes for you. Thank you!

1 Like