Change the size of the product page image

Hello
How can I adjust the size of the image on the product page and reduce it to fit the website?

Hello,

You can find the sizes used on the demo here: https://xtemos.com/docs/woodmart/faq-guides/image-size-content-alignment-product-grid/

Also Navigate to Theme Settings > Single product and configure the product page layout.

Best Regards.

The method you suggested to me did not work; the images appear too large on the product and store pages because the images have a height of 1100 pixels and a width of 700 pixels in webp format. Is there any other way to make the image appear in an appropriate size for the web page? Thank you for your assistance.

Hello,

Main image width – Image size used for the main image on single product pages. These images will remain uncropped. Image width used in demo sites are: 600px;

Please check this manual and try to set the same options: https://xtemos.com/docs/woodmart/faq-guides/image-size-content-alignment-product-grid/

If you have any questions please feel free to contact us.

Best Regards.

.

Hello,

I have added a test product on your site and uploaded images. The images are showing fine. Please check the test product on the shop page.
https://urx.se/produkt/test-woodmart-image-size/

Please try adding products images same size and check the issue.

Best Regards.

Hello,

Thank you for your assistance so far. Despite adjusting all images to a width of 1050 pixels and a height of 1200 pixels, the images still appear large on the product page. Is there any other method to control the image size on the product page? I would greatly appreciate your guidance on this matter.

Your prompt assistance is highly valued.

Best regards,

Hello,

Please try using the below Custom CSS code and paste it to Dashboard >> Theme Settings >> Custom CSS >> Global CSS section:

.woocommerce div.product div.images img {
    max-height: 100px;
    width: auto;
    display: block;
}

Best Regards.

Hello, I have successfully resized the product image on the product page. Thank you! The product images also appear large on the store’s grid page. Is it possible to reduce the size of the product images using code or by configuring the template?

Attachments:

You must be logged in to view attached files.

Hello,

Navigate to Appearance > Customize
Then go to WooCommerce > Product Images
Write your desired width in the “Thumbnail width” field.
Also, you can define the “height” of the shop thumbnails by setting up the width:height aspect ratio in the “Thumbnail cropping” section:

1:1: If you select 1:1, your images will be cropped into squares

Custom: In Custom you can select the aspect ratio of the image. Here are some of the popular aspect ratios (1:1, 5:4, 4:3, 3:2, 16:9 and 3:1).

Uncropped: Height of the image will be untouched. Images will display using the aspect ratio in which they were uploaded.

Best Regards.

I tried all the options, but the image looks cropped or large

Attachments:

You must be logged in to view attached files.

Hello,

Our theme doesn’t control product image size. It is controlled by the WooCommerce plugin. You can configure it in Appearance -> Customize -> WooCommerce -> Product images.

The image heights are not the same. I kindly recommend you prepare images with titles you want before uploading them to your media library using the graphic editor (Photoshop or any other) to have a nice-looking grid.

Best Regards.

[Author]

Posts