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

Solved
skiller1
Tourist
9 0 3

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
Shopify Partner
14255 1657 5134

@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.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
suyash1
Shopify Partner
1988 202 303

@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

you are welcome to contact me.
My email - suyash.patankar@gmail.com

#1 page builder app on Shopify - for FREE! PageFly

My timezone is GMT+5:30
skiller1
Tourist
9 0 3

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!

0 Likes
suyash1
Shopify Partner
1988 202 303

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

you are welcome to contact me.
My email - suyash.patankar@gmail.com

#1 page builder app on Shopify - for FREE! PageFly

My timezone is GMT+5:30
0 Likes
suyash1
Shopify Partner
1988 202 303

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

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

 

suyash1_0-1611242913410.png

 

you are welcome to contact me.
My email - suyash.patankar@gmail.com

#1 page builder app on Shopify - for FREE! PageFly

My timezone is GMT+5:30
skiller1
Tourist
9 0 3

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!

 

0 Likes
suyash1
Shopify Partner
1988 202 303

This is an accepted solution.

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

you are welcome to contact me.
My email - suyash.patankar@gmail.com

#1 page builder app on Shopify - for FREE! PageFly

My timezone is GMT+5:30
0 Likes
skiller1
Tourist
9 0 3

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

0 Likes
suyash1
Shopify Partner
1988 202 303

@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

you are welcome to contact me.
My email - suyash.patankar@gmail.com

#1 page builder app on Shopify - for FREE! PageFly

My timezone is GMT+5:30
0 Likes