Hello, I’m using an app called Live Preview Webyze so customers can customize some of their items on my site. It looks fine on desktop but I’ve noticed recently it’s horrible on mobile. There is a HUGE gap from where you make the selections to where the previewed shirt is, and the pre-made shirt options are extremely tiny thumbnails. I have no idea how to fix this! Please help.
Here a link directly to the page I’m referring.
https://pandorajgifts.com/products/customized-t-shirts?_pos=1&_sid=4e6d61e71&_ss=r
Thank you in advance for any help.
1 Like
Hello There,
- In your Shopify Admin go to online store > themes > actions > edit code
- Find Asset >theme.css and paste this at the bottom of the file:
.product-single__thumbnails li.grid__item {
max-width: 52px;
width: auto;
object-fit: cover;
padding: 0;
}
.product-single__thumbnails {
display: flex;
flex-wrap: wrap;
margin: 20px 0 0 0;
}
.product-single__thumbnails li.grid__item img.product-single__thumbnail-image {
width: 100%;
height: 100%;
object-fit: cover;
}
Thank you for answering. I entered the code where you said and the images are larger except now the height larger but the width is super skinny. You can’t see the products, they appear to be in strips.
www.pandorajgifts.com
I couldn’t leave the site like that so I took a screen shot
