Compared at Price Not Showing On Collection Page (Porto theme)

[skiller1]

Hi

For some reason the compared at price is only showing on Product Page and not on Collection Page. 

Strange thing is that when I input compared at prices on an older copy version of my page it comes up! 

Am I missing something here??

Can somebody please help!

Thanks in advance!

[KetanKumar]

@skiller1 

Sorry for facing this issue, it's my pleasure to help us.

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

[suyash1]

@skiller1 - it can be due to 

1 - compare price hidden on collection by css or

2- code not present in collection template or

3 - wrong code not able to fetch price

[skiller1]

Hi

Thanks for the replies! 

I've looked up the product-grid-item.liquid and this is what is on it;

<div class="price">
{% if on_sale %}
<div class="compare-price">
<span class="money">{{- product.compare_at_price | money -}}</span>
</div>
{% endif %}
{% if on_sale %}
{% if product.price_varies %}
{% assign sale_price = product.price | money %}
<span class="money">
{{- 'products.product.on_sale_from_html' | t: price: sale_price -}}
</span>
{% else %}
<div class="special-price">
<span class="money">{{- product.price | money -}}</span>
</div>
{% endif %}
{% else %}
{% if product.price_varies %}
{% assign price = product.price | money %}
<span class="money">{{- 'products.general.from_text_html' | t: price: price -}}</span>
{% else %}
<span class="money">
{{- product.price | money -}}
</span>
{% endif %}
{% endif %}
</div>

the site is www.craftcentral.ie

Thanks again!

[suyash1]

@skiller1 - do you have any collection link which has compare price? or products put on sale?

[suyash1]

I got it, add following css to the end of your css file

.compare-price {display: block;    text-decoration: line-through;}

[skiller1]

Hi

Great! I added it to my collection css file; and it worked when I go into each collection however it still doesn't seem to show on my homepage.

Am I supposed to add it into another file as well? Sorry I am new to this!

Thanks!

[suyash1 · Accepted solution]

@skiller1 - add very same css to styles.css as well and it will work

[skiller1]

Oh that's perfect! Thanks so so much!

Can I ask if you could help with two other issues; I posted them but didn't get much response!

On mobile view my announcement bar doesn't seem to show? I have installed a separate app to temporarily remedy that but it would be great if I did not have to use the app?

Also on my customer account page the container for account info and previous order seems to be overflowing that I would have to scroll side ways to view the whole of it; is there something I can do to remedy these?

Thanks again

[suyash1]

@skiller1  - this css will help to show announcement bar on mobile

@media only screen and (max-width: 479px){
.top-newsletter {
    display: block;
}
}

which account page are you saying about? as I have not logged in, I will not see order