Return to previous page

How to set the dimension of the image field in the product list – part 2

This topic has 8 replies, 2 voices, and was last updated 2 years, 6 months ago ago by Olga Barlow

Chris

Participant

May 5, 2022 at 20:15

I closed the previous topic therefore I am returning to it here.
https://www.8theme.com/topic/how-to-set-the-dimension-of-the-image-field-in-the-product-list/#post-316531

Your proposed implementation works very well in the designated areas we wrote about.

However, we have a problem with the same in the mobile option. Picture in the link: https://prnt.sc/axAqgr94N5Lj

How to remedy this?

The above setting also caused the images to show up badly on the product page. In categories according to the above codes they are nicely clipped to the designated size, but on the product page they are often too large and on the entire page. What can we do about it?

#323224 Copied Theme version: 8.1.4

7 Answers

Olga Barlow

Support staff

May 5, 2022 at 23:22

Hello,

Remove media query for this code https://prnt.sc/Zqfp1SHK5fzZ
Or add a media query for the smaller devices and reduce the height.

Regards

#323240 Copied

Chris

Participant

May 7, 2022 at 20:46

Unfortunately this solution did not help because the height of the frame increased significantly.

#323396 Copied

Olga Barlow

Support staff

May 9, 2022 at 16:45

Hello,

Unfortunately, in this case, the only solution is to use a hard crop for the images (Theme Options > WooCommerce > Product images) or upload all the images with the same proportions.

Regards

#323476 Copied

Chris

Participant

May 10, 2022 at 09:41

Thank you for the information.

I have one more question for the solution used. Fields of product photos are the same height, but when the photo is higher we have a problem with the label text moving below. Can you suggest what to change so that this does not happen?

Example in the link. Thank you.

https://prnt.sc/JeeqRmtS7pZx

#323551 Copied
Olga Barlow

Support staff

May 10, 2022 at 14:48
Hello,

It’s because of styles that the third-party plugin adds for the div inside the image block.

Try to add custom code below and check if that helps you:
```
.product-content-image > div {
    position: static !important;
}
```
Regards
#323577 Copied
Chris

Participant

May 10, 2022 at 15:03

Yes, it works. Great. Thank you. I tried that, but something went wrong. It’s great now.

#323582 Copied

Olga Barlow

Support staff

May 10, 2022 at 15:10

Hello,

You are welcome.

Regards

#323585 Copied
Tagged: dimensions, images, products, setup, theme, woocommerce, wordpress
Viewing 8 results - 1 through 8 (of 8 total)

The issue related to '‘How to set the dimension of the image field in the product list – part 2’' has been successfully resolved, and the topic is now closed for further responses

How to set the dimension of the image field in the product list – part 2

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection