FROM CACHE - en_header

Need help hiding variant images - Minimal Theme

Solved
RoadToFreedom
New Member
3 0 0

Hi Guys,

I am new to the Shopify Community and decided to build my first website today. At the moment I am encountering some issues with my product page. So I am going to sell a product which has multiple variants. On the main page it's all nicely in order, customer can select a variant and it will show the correct image. Here comes the issue --> once clicking on "Full Details" it will redirect the customer to the product page. On the product page it shows all the images of the variants I am offering. They are stacked from top to bottom. I don't mind those images to be there, but I prefer not to. 

Result I had before:
The variants were stacked one by one from top to bottom. 

Below the result I would like: 
like that.png

Hopefully I was clear enough. 

Thanks in advance!

Accepted Solution (1)

Accepted Solutions
Jasoliya
Shopify Expert
4552 586 1154

This is an accepted solution.

HI @RoadToFreedom 

If you want to hide your variants images from product page then add bellow css in Asset->theme.scss file at bottom:

.product-single__thumbnails {   display: none;}
Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here

View solution in original post

Replies 22 (22)
24by7themes
Shopify Partner
400 61 77

can you please share your store url

Shopify Plus Expert, Quality Service Provider, CONTACT ME for any kind of solutions.
Please like and accept solution. SKYPE -> live:gp21111990
Jasoliya
Shopify Expert
4552 586 1154

This is an accepted solution.

HI @RoadToFreedom 

If you want to hide your variants images from product page then add bellow css in Asset->theme.scss file at bottom:

.product-single__thumbnails {   display: none;}
Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
RoadToFreedom
New Member
3 0 0

Wow. Thank you very much! Solved my issue! 🙂 

Edv
New Member
4 0 0

Hi Guys,

 

So that code hiding all thumbnails. is it possible to hide all variants images, but keep there none variants images?

Jasoliya
Shopify Expert
4552 586 1154

For that you can use this variable "image.attached_to_variant?"

Find code in section->product-template.liquid file

Check condition in variants loop like 

{% unless image.attached_to_variant? %}
//your thumb image code goes here 
{% endunless %}
Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Edv
New Member
4 0 0

Thank you for your reply! What code should i find in product-template.liquid file? and that command need to add somewhere or...? Sorry to bother you! 🙂

Jasoliya
Shopify Expert
4552 586 1154

Yes you have to add code in section->product-template.liquid file and find 

{% for image in product.images %}

give condition next to this and end just before {%endfor%}

Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Edv
New Member
4 0 0

Thank you for getting back to me! 🙂 I found that {% for image in product.images %} x4 times in that page. Tried to put that code which you provided above, but not sure where exactly i need to paste it...

Capture1.PNGCapture2.PNG

Jasoliya
Shopify Expert
4552 586 1154

Sorry but that you have to check in which condition image generating i can check it form here. 

Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Edv
New Member
4 0 0
Ok, that will be complicated to do by myself 🙂 anyway, thank you very much for your help !
np212585
New Member
9 0 0

will this work if I have more then 1 image for the variant? I want the first 3 images to be visible and when click on the color you select you should only see the color. 

need help.jpg

Jasoliya
Shopify Expert
4552 586 1154

HI 

No this code cant work for this situation,

you want to just show image of select variant right? for that we have to manage custom code.

Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
VRD
New Member
3 0 0

Hi!

I have a bunch of variant images that I need to delete. I can upload more images but cannot delete images that are already uploaded!

How can I do this?

Thanks!

Jasoliya
Shopify Expert
4552 586 1154

HI @VRD 

If you want t remove variant images and want to add new then you can remove it form admin product section where from you have created product.

 

Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
LyndaDanielle
Tourist
3 0 0

Thank you! I was also looking for this code. Saved me a headache. Thanks again ❤️ 

Elik1
New Member
2 0 0

where should I write that?I mean, what line should I write this?

Elik1
New Member
2 0 0
Jasoliya
Shopify Expert
4552 586 1154

What should you want to do exactly ? let me know and share your store url. 

Want to modify or custom changes on store hire me.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Salman_Khan1
Shopify Partner
24 2 5

Hi,

Our app offers exactly the same functionality which you are looking for.

The app will display only the images to the corresponding variant and hide the other images without making changes to your store's theme code.  

Have a look: https://apps.shopify.com/easy-variant-images