- This topic has 6 replies, 3 voices, and was last updated 6 months, 3 weeks ago by Hamid.
June 22, 2020 at 7:46 am #1337460Hamid
Hi, I’m quite beginner in WordPress/Woocommerce. We are developing a website and initially used Generatepress to setting up elements and structure. We have now purchased the premium version to get more functionality for improving the layout. Probably I will have several questions during the development phase. I try to read your documentation to find the most of the answers. At the present time, I have a question that I have not figured out how to handle it. The question is
How to define the size of gridbox and displaying the product image in the center of the box. Currently the height of box varies with the image. I have tried the custom and 1:1 option. Both of them destroys the images, one cropp and the other one destroy the image. Please visit the website URL and any category page in order to get an idea what I’m talking about.
Appreciate your advice and support in this issue. Best regards HamidJune 22, 2020 at 7:56 am #1337611DavidStaffCustomer Support
can you check the URL you provided as its not valid. You can edit your original topic to update the URL.
The best thing to do with Woocommerce images is to ensure they are all the same dimensions before uploading. Ideally they should be square. Even if that means including some ‘whitespace’ around theme. The upfront effort will save a lot of hassle in the future.June 23, 2020 at 7:13 am #1338730Hamid
Hi David Thanks for your prompt response. All images have same size (regarding pixels 1200 x 1200) before uploading. I have run the regenerate to create thumbnails by the plugin.
I have temporarily set the max height to 300 px the custom css. However, this is in somehow working in the Edge & Internet Explorer but in Google Chrome the pictures are disformed.
The best option should be displaying an image, resized to the size of the box and displaying the image in the middle of box which I have not figure how to do it. Another problem is displaying the product in the single product page, There, the image is displayed as it is.
see below links:
Page where almost the grids are displayed at same level
please compare the images in Edge and Chrome.
Concerning the single product page see below link
Note the link are developing plattform and not in real production.June 23, 2020 at 4:15 pm #1339502TomLead DeveloperLead Developer
Are you sure that all of the images are the same size?
For example, the image at the bottom right is 300×308, while the others are 300×439.
Your single product link doesn’t seem to be working.June 24, 2020 at 4:11 am #1340000HamidJune 24, 2020 at 10:13 am #1340533TomLead DeveloperLead Developer
klassiska-mattorpage, I’m not seeing a difference between Chrome and Edge.
It may be worth un-setting the WooCommerce image sizes in Customize > WooCommerce in case they’re messing with your original image sizes.June 29, 2020 at 6:42 am #1345467Hamid
Thx. Will reload the images.
- You must be logged in to reply to this topic.