Return to previous page

RE: Product Carousel Images Squished and/or distorted

This topic has 5 replies, 3 voices, and was last updated 1 years ago ago by Andrew Mitchell

macamrstudios

Participant

February 15, 2024 at 19:31

When viewing pages such as (https://vernegallery.com/artists/hasui-kawase/) on a mobile device, the product images in the carousel at the bottom are only being resized by their width but not proportionately in height, causing the images to look smooshed. I am attaching a screenshot taken from my iPhone 14 Maxpro as a reference.

Please, contact administrator
for this information.

#383536 Copied Theme version: 9.2.8

4 Answers

Luca Rossi

Support staff

February 16, 2024 at 10:48

Dear Macamr Studios,

We hope this message finds you well.

We are reaching out to seek clarification on a matter concerning the display of product images on our platform. We have observed some inconsistencies and would greatly appreciate your expertise in identifying the issues at hand.

For your reference, please find below the links to the screenshots that illustrate how the product images are currently appearing on our end:

– [Screenshot 1](https://prnt.sc/PkQ28TT2Il6R)
– [Screenshot 2](https://prnt.sc/DapWmJ4iX6Wj)

We would be grateful if you could provide us with a detailed explanation of the potential causes of these discrepancies and any recommended solutions.

Thank you for your attention to this matter. We look forward to your prompt response.

Best Regards,
The 8Theme Team

#383572 Copied

macamrstudios

Participant

February 16, 2024 at 15:21

Hi – I am not sure what device you pulled these images from, as yes, those are correct. I am attaching a new set of the same image so you can see how it looks on a desktop browser window (resized to ‘mobile’) versus how it displays on an actual mobile device. You will see that it appears the image is being forced into a square (300×300) format versus the 300 wide by whatever proportional height. Thus rendering the image to look squished.

filename: correct proportions was taken from desktop running chrome with the window sized down to mobile width. This is how the image should display.

filename: incorrect proportions was taken from an iPhone 14 Pro Max running chrome

Files is visible for topic creator and
support staff only.

#383619 Copied
Luca Rossi

Support staff

February 16, 2024 at 16:54
Dear @macamrstudios,

We are pleased to inform you that we have successfully implemented the following custom CSS code within the “Theme Options > Theme Custom CSS > Mobile” section of your website:

.content-product .product-content-image img { height: auto !important; width: auto !important; } .swiper-wrapper { align-items: center; }

As a result of this update, the product images should now be displayed correctly on mobile devices. We kindly request that you review the changes at your earliest convenience to ensure that everything appears as expected.

Should you have any further questions or require additional assistance, please do not hesitate to reach out.

Warm regards,
The 8Theme Team
#383635 Copied
Andrew Mitchell

Support staff

February 16, 2024 at 17:38

Dear macamrstudios,

As we continue our mission to exceed expectations, your insights become increasingly valuable. Could we, with all due respect, request your thoughtful feedback by giving our theme a deserved 5-star rating on ThemeForest?

Click here to share your valuable perspective: https://themeforest.net/downloads

Your time and trust are highly appreciated!

Best Regards,
The 8Theme Team

#383642 Copied
Tagged: fix squished carousel images, image distortion solutions, product carousel images, woocommerce product display, wordpress image optimization, wordpress woocommerce templates
Viewing 5 results - 1 through 5 (of 5 total)

The issue related to '‘RE: Product Carousel Images Squished and/or distorted’' has been successfully resolved, and the topic is now closed for further responses

RE: Product Carousel Images Squished and/or distorted

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection