strikethrough line on product price - dawn theme

[Vws9]

Hello,

I have a shopify store and i want to use Dawn theme, but after i uploaded my products and set the prices

as you can see in the image

on product page or in the front page i dont have that line that cross on the higher price .. the strikethough line ..

And i dont know why cuz like 5 years ago i used shopify for a store and it was that simple but now ..

Can anybody help me please ?

[lynth]

Hi Vws9, try this:

1. Access the Theme Editor:

   • Go to your Shopify admin panel.
   • Navigate to Online Store > Themes.
   • Find the Dawn theme and click on Customize.

2. Enable Compare-at Price:

   • In the theme editor, navigate to the Product pages.
   • Look for the section where product prices are displayed.
   • Ensure that the Compare-at price is enabled. This might be a setting within the product price section or a checkbox that needs to be checked.

3. Edit Theme Code (if necessary):

   • If the compare-at price isn’t showing up, you may need to edit the theme code.

   • Go back to the Themes section and click on Actions > Edit code for the Dawn theme.

   • Open the main-product.liquid file located under Sections.

   • Look for the code that displays the product price. It will look something like this:

{{ product.price | money }}

• Add the compare-at price code:

{% if product.compare_at_price > product.price %}
{{ product.compare_at_price | money }}
{% endif %}

[magecomp]

Hello @Vws9

If your theme isn’t displaying the strikethrough correctly, try this

• Go to Online Store > Themes.

• Click “Actions” > “Edit code” for your active theme.

  • Look for a file named price.liquid or something similar. This file typically controls how prices are displayed.

    • Look for the code that displays the compare-at price.
    • Add the CSS style text-decoration: line-through; to the HTML element containing the compare-at price.

<span class="compare-at-price" style="text-decoration: line-through;">{{ product.compare_at_price | money }}</span>

[Moeed]

Hey @Vws9

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

[Vws9]

I dont have this line of code in main-product.liquid, also i search for this line in price.liquid and nothing

{{ product.price | money }}

I just saw that if i want to edit the product on store, the sale will show

but if i click save or anything and exit the sale doesnt show …

[Dan-From-Ryviu]

Hi @Vws9

It should have a line-through on compare prices by default on the Dawn theme. Maybe some customized code you added caused this issue. Could you share store URL so I can check?

[Vws9]

That is all the code from price.liquid

{% comment %}
  Renders a list of product's price (regular, sale)

  Accepts:
  - product: {Object} Product Liquid object (optional)
  - placeholder: {Boolean} Renders a placeholder price (optional)
  - use_variant: {Boolean} Renders selected or first variant price instead of overall product pricing (optional)
  - show_badges: {Boolean} Renders 'Sale' and 'Sold Out' tags if the product matches the condition (optional)
  - price_class: {String} Adds a price class to the price element (optional)
  - show_compare_at_price: {Boolean} Renders the compare at price if the product matches the condition (optional)

  Usage:
  {% render 'price', product: product %}
{% endcomment %}
{%- liquid
  if use_variant
    assign target = product.selected_or_first_available_variant
  elsif placeholder
    assign target = null
  else
    assign target = product
  endif

  assign compare_at_price = target.compare_at_price
  assign price = target.price | default: 1999
  assign price_min = product.price_min
  assign price_max = product.price_max
  assign available = target.available | default: false
  assign money_price = price | money
  assign money_price_min = price_min | money
  assign money_price_max = price_max | money
  if settings.currency_code_enabled
    assign money_price = price | money_with_currency
    assign money_price_min = price_min | money_with_currency
    assign money_price_max = price_max | money_with_currency
  endif

  if target == product and product.price_varies
    assign money_price = 'products.product.price.from_price_html' | t: price: money_price
  endif
-%}

{%- unless target == null and placeholder == null -%}
  
    

      {%- comment -%}
        Explanation of description list:
          - div.price__regular: Displayed when there are no variants on sale
          - div.price__sale: Displayed when a variant is a sale
      {%- endcomment -%}
      

        {%- if product.quantity_price_breaks_configured? -%}
          {%- if show_compare_at_price and compare_at_price -%}
            {%- unless product.price_varies == false and product.compare_at_price_varies %}
              
                {{- 'products.product.price.regular_price' | t -}}
              
              
                <s>
                  {% if settings.currency_code_enabled %}
                    {{ compare_at_price | money_with_currency }}
                  {% else %}
                    {{ compare_at_price | money }}
                  {% endif %}
                </s>
              
            {%- endunless -%}
          {%- endif -%}
          {{ 'products.product.price.regular_price' | t }}
          
            {{-
              'products.product.volume_pricing.price_range'
              | t: minimum: money_price_min, maximum: money_price_max
            -}}
          
        {%- else -%}
          {{ 'products.product.price.regular_price' | t }}
          
            {{ money_price }}
          
        {%- endif -%}
      

      
        {%- unless product.price_varies == false and product.compare_at_price_varies %}
          {{ 'products.product.price.regular_price' | t }}
          
            <s>
              {% if settings.currency_code_enabled %}
                {{ compare_at_price | money_with_currency }}
              {% else %}
                {{ compare_at_price | money }}
              {% endif %}
            </s>
          
        {%- endunless -%}
        {{ 'products.product.price.sale_price' | t }}
        
          {{ money_price }}
        
      

      <small>
        {{ 'products.product.price.unit_price' | t }}
        
          {{- product.selected_or_first_available_variant.unit_price | money -}}
          /
           {{ 'accessibility.unit_price_separator' | t }} 
          
            {%- if product.selected_or_first_available_variant.unit_price_measurement.reference_value != 1 -%}
              {{- product.selected_or_first_available_variant.unit_price_measurement.reference_value -}}
            {%- endif -%}
            {{ product.selected_or_first_available_variant.unit_price_measurement.reference_unit }}
          
        
      </small>
    

    {%- if show_badges -%}
      
        {{ 'products.product.on_sale' | t }}
      

      
        {{ 'products.product.sold_out' | t }}
      
    {%- endif -%}
  

{% endunless %}

[Vws9]

https://af4f76-8c.myshopify.com/

that’s the url

i didn’t customized the code or something, just the basic product uploads and setting the prices..

[Dan-From-Ryviu]

Which product has a compared price higher than the price? You must add a compared price value higher than the price then it will automatically add a line-through

[Vws9]

All of them …

The compare price is 49.90 and the price 29.90, but …

[Dan-From-Ryviu]

I see they are the same price.

[lynth]

Vws9 do you use any sales apps?

[Vws9]

i dont know why ..

look

so i dont get it, there is a bug a the theme ?

[Vws9]

Nope, i have 0 apps installed, i just installed the theme and imported the products ..

[lynth]

I’m not sure. Try to change the compare price and save it. We’ll see what will happen.

[Vws9]

I did this, repeatedly, but the result remains the same

[Vws9]

So that means there is no solution for my problem ?

[Vws9]

So i think i managed to solve the problem i guess

I imported all the products from my previous store that was made with wordpress + woocommerce, on all my imported products i have the problem with the compared-at price, but i just wanted to see if i upload a product manually (a test product), the problem will still be there ?

As an answer - no, the compared price appeared, but the text is in frech i dont get it how because all the store is in another language not in frech, but still it’s much better than previous problem..

Thank you all for your help !

[siva7077]

i see this in theme.css ,
adding text decoration will fix this .

.Price–compareAt {
color: #acacac;
text-decoration: line-through;
}