Remove product images from the bottom of a product page

[xHeadMan]

Hi there,

I'm having trouble removing the auto-generated images that appear at the bottom of a product page. I'd like to just straight remove them. If there's a way to replace these images with other images, that would also be useful!

I've attached in image of what I mean.

Any help appreciated! 

[KetanKumar]

Hello, @xHeadMan 

Please share your site URL,

So I will check and provide a solution here.

Want to modify or custom changes on store hire me.

If helpful then please Like and Accept Solution.

Email: bamaniyaketan.sky@gmail.com

Skype : bamaniya.sky

[Jasoliya · Accepted solution]

Hi @xHeadMan 

Thats your variants images, In this theme you have option to hide variant image from theme editor:

1. Open theme editor->go to product page from top select box-> select "Product pages" from left side bar and then check "Hide variant images in gallery" option.

2. Add this css in your asset->theme.scss file at bottom:

.product__subimage-list{display:none;}

[xHeadMan]

Changing the code worked! Thanks a lot 🙂

[JackyFromWelly]

Hey, 

i have the same problem but with the boundless theme, how do i fix it on that theme?

because adding the .product.. doesnt fix it for me. Neither putting it to the other .product's or at the end.

Thanks in advance

[Jasoliya]

Hi @JackyFromWelly 

In this theme we have same selector for main image and variant image so we have to add class in just variant images so we can hide it by class.

Open section->product-template.liquid file and find bellow comment code:

{% comment %}
      Show other product images below product info if there's any left to show
    {% endcomment %}

Now add 'hide_var_img' class in 'product__photo' div as per image:

then add this css in asset->theme.scss fiel at bottom:

.hide_var_img{display:none;}

[Extenfullhair]

Hello-

I would like to remove the image for some of my products. I would like my services to show as a list without any images.

[Jasoliya]

Which theme you have send store url 

[Extenfullhair]

https://extenfull-hair.myshopify.com/

[KetanKumar]

Hello, @Extenfullhair 

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.

[Extenfullhair]

thank you, extenfull-hair.myshopify.com

[KetanKumar]

@Extenfullhair 

Thanks 

can you please check the theme setting 

enable thumbnail 

[silknsoleil]

Hi, i also use Narritive theme and my product photos are at the bottom of the page. Can I move them up with my initial product photo?

[DWXavier]

HI HI ! 
I am experiencing the same problem. Can you assist ? Here’s is my URL Link : dxpectation.myshopify.com 

[KetanKumar]

@DWXavier 

thanks for it 

can you please add this 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.hide_var_img.product__photo.grid__item.medium-up--one-half {
    display: none;
}

[DWXavier]

OMG IT WORKED !!!!! Thank you so much for all of your help.

[KetanKumar]

@DWXavier 

it's my pleasure to help us

[Azco]

Can you please help me ? I'm using Supply theme.

Thank you

[KetanKumar]

@Azco 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[Jasoliya]

Hi @Azco follwo this

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css-> paste bellow code in bottom of file

.product-photo-thumbs{display:none;}

[MerDesDieux]

Hi, 

I'd like remove the image the image at the bottom of my page. My website url is below.

https://www.merdesdieux.com/collections/wave-seals/products/printed-silk-scarf

[MerDesDieux]

Nvm I think I figured it out.

[Ondrejj]

Hello,

I fixed in my boundless theme the product images show down there (thank you), but down there is still showing preview image of the product and on the product mein image is imege from variant and i want to have the prewiew image to be that image down there. Can you please help me?

Thank You.

[Jasoliya]

Send me store url will check

[Ondrejj]

Mu url: to-be-comfortable.myshopify.com (in section of product) password for the page: cialde. And is this free?

Thank you.

[Jasoliya]

I see you mean 2 big image displaying on top right ?

but if we hide one then it will look like not proper, so we have to change whole product page like two column (left main image with bottom slider of all thumb image + right side all information)

like https://sample-store-1331.myshopify.com/products/codify-product?preview_theme_id=81217355843

but for that you have to pay so if want pm me

Best regard 

[Ondrejj]

Hello,

I don't want to pay. I mean it from mobile phone wiev and i thing there is wrong in a code (just remove the mein image of product (don't show down there)) so if you can help me for free with the code i will be happy.

Thank you.

[Jasoliya]

I see this is not possible by direct code, need to manage some code, because default one variant selected so its changing image to variant image.

You have to do code that do not selected default variant on page load, and you cant do it as for that need customization, hire developer from shopify expert or pm me 

Best regard 

[Jasoliya]

Dont worry you no need to pay anything

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css-> paste bellow code in bottom of file

@media only screen and (max-width: 767px) {
     .product__photo.grid__item.medium-up--hide{display:none;}   
    }

[Ondrejj]

Hello,

Thank you that worked, but my mein image of product doesnt show on product. With witch code i can fix that.

Thank you

[Ondrejj]

Hello,

Thank you that worked, but my mein image of product doesnt show on product. With witch code i can fix that.

Thank you

[KetanKumar]

@Ondrejj 

please show me issue image!

[Ondrejj]

 

 

[KetanKumar]

@Ondrejj 

yes please give this product url

[Ondrejj]

https://to-be-comfortable.myshopify.com/products/oversized-hoodie

Password: cialde

[KetanKumar]

@Ondrejj 

you have added unnecessary code please revert and ck

[Ondrejj]

Doesn't work, mein image is still doesn't show. 

[KetanKumar]

@Ondrejj 

can you please check your default theme code its work?

[Ondrejj]

I don't want to reset whole site. I have done a lot of work with this site.

I hope you understand me, thank you.

[KetanKumar]

@Ondrejj 

yes please sent me your theme zip code so i will check and let you know 

[Ondrejj]

I don't know where to find that zip code.

[KetanKumar]

@Ondrejj 

download your theme and sent

[Ondrejj]

Here is the theme.

[KetanKumar]

@Ondrejj 

thanks, i have tried but theme was crack doesn't upload

[Ondrejj]

Now should work.

[Ondrejj]

Now should work, please check it.

Thank you.

[KetanKumar]

@Ondrejj 

let's have check

[Ondrejj]

Did you check that?

Thank you.

[Ondrejj]

Hello, can you check that plase?

[Jasoliya]

send me store url

[Ondrejj]

to-be-comfortable.myshopify.com

[KetanKumar]

@Ondrejj 

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community!😊
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

[mylonc]

Hey! @Jasoliya  This solution seems to work great but apparently not with the Boundless theme which I use. Do you have a solution for that theme too? 🙂 I want to hide the variant images and only show 1 image (the product image) and have only the variants show when they are being selected by a customer. My store is thirsty-pal.com and password thirstypal (It's designed for mobile devices only)

[Jasoliya]

Hi @mylonc 

For this theme need to add selector to variant images after that we can remove or hide it.

right all images are generating in same selector div. PM me, also need to change page structure because main image showing at left side in this theme. 

[silknsoleil]

Can we move them under the product image? s its a slide gallery?

[Jasoliya]

Send your store url.

[visivo]

i am having the same problem, but I cannot fix it. Can someone help me pls?

[Jasoliya]

Send your store url

[ip93]

Hey! I have the narrative theme and the same problem. I tried to insert the code in scss but it's not working!

Thank you in advance!

[Jasoliya]

Send your store url

[ip93]

http://storeurlhehe.com

[Jasoliya]

Add this css:

.product__submedia-list{display: none;}

[ip93]

Works! Great! 

Thank you very much! 

Have a nice day.

---

@Jasoliya wrote:

Add this css:

.product__submedia-list{display: none;}

---

[caprempeh]

Hi, 

Is there a way to do this for the Debut theme please? 

I've tried but with no luck unfortunately 😞

Thank you!!

[Jasoliya]

you can hide it by my give css bu you cant make it like debut theme for that we have to change many code for thumb mages. 

[Bells_beach]

Hey I also have the narrative theme and this problem.. Can you help me out?
Really want to remove the product pictures right under the product.

Thanks in advance.

[Jasoliya]

add this code:

.product__submedia-list{display: none;}

[Bells_beach]

Where exactly in the code?

thanks in advance.

---

@Jasoliya wrote:

add this code:

.product__submedia-list{display: none;}

---

[Luke121]

Hey Jasoliya adding this code in narrative theme doesn't work for me is there any other code

[Jasoliya]

Hi @Luke121 

Send your store url i will check

[jamieszt]

Hi,

I am trying to remove the small product images under my main image but keep them as variants so when a customer picks that variant, the main image changes to that specific variant paired with the hidden picture if that makes sense? I am using the minimal theme. At the moment I have about 28 or so small images under the main image, also as you can tell I'm new to this, is my shopify URL literally the domain name?

I've seen various replies saying add this code

.product__submedia-list{display: none;}

but where in the code for product-template.liquid is this added?

I really would appreciate if someone could clear this up for me!

Jamie