[raoul_k@hotmail.co.uk]

Hi, I would like to not show the product images on the cart page for mobile only. The images are large and take up most of the screen. I would still like to keep the product images on the cart page for desktop.

Do you know how I would be able to do this? Thank you

[Althemist]

Hello raoul_k@hotmail.co.uk,

I am afraid you can’t really remove them. You can only hide them with CSS and media query.

[raoul_k@hotmail.co.uk]

Thanks for getting back Dimitar.
I tried adding the custom CSS below but it didn’t work. If I increase max-width to 1300px then it works on desktop (i.e. the images are hidden)! But if I reduce to <1300px then it won’t hide the images for mobile.

I understand this is probably outside the scope of support but is there any reason you would expect the below CSS not to work?

@media (max-width:770px) {.product-thumbnail{
display:none
}}

[Althemist]

The code above will only work on screens bellow 770px. Also, you should be more precise with the selector.

Something like this:

@media only screen and (max-width: 768px) {
.woocommerce-page table.shop_table_responsive tr td.product-thumbnail {
    display: none;
}
}

[Author]

Posts