This topic has 5 replies, 3 voices, and was last updated 10 months, 1 weeks ago ago by Andrew Mitchell
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.
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
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
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
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
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