This topic has 10 replies, 3 voices, and was last updated 3 months ago ago by Andrew Mitchell
Hi,
Please see attached screenshot and the red line below one of the thumbnail images.
How do I get all the thumbnail images to have the same width and height, as in this example, the height of the thumbnail image is different to the others.
Page URL has also been attached
Thanks
Also here on the homepage you can also see this thumbnail image on the far right is also a smaller height than the other 3.
Thanks
Hi @Applesandcider,
Please try adding this custom CSS under XStore > Theme Options > Theme Custom CSS > Global CSS:
.single-product ul.thumbnails-list img {
width: 100%;
height: 100%;
object-fit: cover;
min-height: 165px;
}
.home .etheme-product-grid-image img {
min-height: 283px;
object-fit: cover;
}
Hope it helps!
Hi, looks better thank you. Only section it has seemed to effect badly is this section on the homepage, and also the mobile version of it also. Before the images were centred and now they’re to the right. But everything else looks fine and the code worked. Any way to fix those images in the attached?
Thanks
Dear @Applesandcider,
We kindly request that you update the previous CSS codes with the following, to ensure they apply specifically to the designated section:
.single-product ul.thumbnails-list img {
width: 100%;
height: 100%;
object-fit: cover;
min-height: 165px;
}
.home [data-id="9f8090d"] .etheme-product-grid-image img {
min-height: 283px;
object-fit: cover;
}
Thank you for your attention to this matter.
Best regards,
The 8Theme Team
Hi,
that fixed the single product section thanks, but the home page section did not change.
I have updated my FTP credentials and WPAdmin access as 8theme staff were having problems accessing. Hopefully now both FTP and WPadmin are accessible.
Thanks
Hi @Applesandcider,
Sorry for the confusion!
The correct codes should be:
.single-product ul.thumbnails-list img {
width: 100%;
height: 100%;
object-fit: cover;
min-height: 165px;
}
.home [data-id="38b786d"] .etheme-product-grid-image img {
min-height: 283px;
object-fit: cover;
}
If it still doesn’t work, please provide us with the Login URL again. We will add some custom class to that section.
Best regards,
The 8Theme Team
That has worked perfectly thank you!
Dear Applesandcider,
We trust our theme is enhancing your experience. Taking a brief moment to rate it with a glowing 5 stars on ThemeForest would be immensely appreciated. Your feedback holds significant value for us.
Click here to rate now: https://themeforest.net/downloads
Thank you sincerely for your ongoing support!
Best Regards,
The 8Theme Team
The issue related to '‘Get all thumbnails on single product pages to have the same width and height’' has been successfully resolved, and the topic is now closed for further responses