Return to previous page

Image on hover is smaller than the original image

This topic has 4 replies, 2 voices, and was last updated 2 months, 1 weeks ago ago by Rose Tyler

masterpiece

Participant

October 9, 2024 at 20:05

Hi,
It seems that in your demo Home Decor 02, images that are displayed on hover have smaller width than the original image.
Please see attachments 1 and 2. In the attachment 1, you can see that the original image has dimensions 460x600px. In the attachment 2, you can see that the second image that is displayed on hover effect has dimensions 400x522px. You cannot see that in your demo because both images have exactly the same background. But this is perfectly visible if the background is even a bit different. Then there it is clearly visible that a smaller image is shown on top of the larger image, which simply looks ugly and unproffesional – please see screenshot 3 where you can clearly see the border around the image. You can easily reproduce it on your demo – simply use images with different backgrounds.
Can you please fix it?

Files is visible for topic creator and
support staff only.

#418049 Copied Theme version: 9.4.2

3 Answers

Rose Tyler

Support staff

October 10, 2024 at 07:54

Hello, Masterpiece,

Thank you for getting in touch with us.

Appearance > Customize > WooCommerce > Product Images > Thumbnail width – set 460, uncropped, and regenerate thumbnails using a plugin –
https://www.8theme.com/documentation/xstore/woocommerce/product-images/

Best Regards,
8Theme’s Team

#418093 Copied

masterpiece

Participant

October 10, 2024 at 16:03

Won’t this cause problems in another place? I assume that 400px was set for a reason?

#418187 Copied

Rose Tyler

Support staff

October 11, 2024 at 07:15

Hello, Masterpiece,

Please read this article for a better understanding of the mentioned options – https://www.8theme.com/documentation/xstore/woocommerce/product-images/
In your case, the 460px is required.

Best Regards,
8Theme’s Team

#418238 Copied
Tagged: image hover issue, image size fix, improve woocommerce display, optimize woocommerce images, woocommerce themes, wordpress solutions, wordpress theme troubleshoot
Viewing 4 results - 1 through 4 (of 4 total)