How I can change the way woocommerce show my products image in products catalog page? Woocommerce doesn't show the uploaded images in correct cropping format and the pictures don't look ok. Here's an example: I have tried customized>WooCommers>Product Images>Thumbnail cropping but it doesn't solve the problem for me. The pictures get cropped while I want to show the whole image on the square frame. This is not good if I want to show a pictures with different dimensions! What should I do? I use Flatsome theme.
Try this: Go to Appearance > Customize > WooCommerce > Product Images > select "Uncropped". This should make it so that the original aspect ratio doesn't change, so if all the images are for example a 5:4 aspect ratio, your category/catalog page thumbnails should all be 5:4 images instead of square. If you truly want all the images to look the same (or all be squares), you'll need to re-upload them as the same aspect ratio.
Related
Goal: When creating an image gallery in Wordpress 5.3.2 using the Gutenberg editor, I'd like to be able to select the image size.
Why: The block gallery automatically serves the large image and then relies on CSS to resize the image to fit the flexbox layout. Instead I'd like to choose the medium size for my site, which is closer in size to what's displayed in the layout. This will improve load times, as users aren't being served oversized images.
Question: Is there some code I can add to functions.php that will give me the option to choose the image size I want or to override the default large size for the medium size?
I understand what you're going for and unfortunately WordPress and Gutenberg still loads the full-size, original image (and just resizes it in css) :(
There are several closely-related issues that describe this
https://core.trac.wordpress.org/ticket/45407
https://github.com/WordPress/gutenberg/issues/9620
https://github.com/WordPress/gutenberg/issues/6177
Update, 2021:
Gutenberg no longer loads the full-size, original image and you can choose which in the block's right side panel which of the registered image sizes to load;
but that image is often still larger than necessary and not fully optimized; more information at https://gist.github.com/skorasaurus/a01249d4302226bf12c80dd979322303
This is a page of my blog https://desandre.odns.fr/lemadame/portfolio-work/carole-nicolas (ssl is not active so you should clicked on advanced and then continue).
The theme I use shows images 1110px wide but I would like to show bigger pictures like here for example: https://damiendesandre.myportfolio.com/carole-et-nicolas It seems much better.
How can I get this result ?
Thanks
If you have any builder plugin then you have to add image only in row component and you will get the 80% width of image based on screen resolution.
I’m having a problem with my cart page. The problem I’m having is the product thumbnail image is cropped and is cutting off my image.
I went to the product display settings and adjust the thumbnail size and the thumbnail image is still too small and cropped.
cart page image
I want to figure out how to fix this issue, can someone help?
I also want to find out how can I change the product image on the cart page to a different picture and it not effect the product images on front-end of my site.
Because we don't have a code here I just can figure out what it could be. You can try to set this css to the product image:
.your-product-image { /*PLEASE UPDATE*/
overflow: hidden;
}
Wordpress auto generates images with all possible demnisions..
For example: generate thumbnail, medium, large etc
How I can make wordpress produce images only on demant.
For example if I want only have the thumbnail size for one image, then the only images which are created will be only the original size and the thumbnail size. For other image, maybe I will want only the original kai medium size..
Is it possible to do something like that?
I don't talk about unset function..
Sorry for my English!
That's how WordPress works, it's native behaviour, it generates all possible thumbnails of the image so it can be loaded in any size when needed. In other words, thumbnails are generated when uploading image and not when showing in (on-demand concept).
I got some problems with my WooCommerce site, whereas the images on the products list does not work
http://bio7.dk.linux82.curanetserver.dk/billede/
This is the link... as you can see, the images are not all the same size, even though all images are set to be
210pixels X 210 pixels with Hard-Crop
I hope anyone can tell me, why the images aren't that size...
My Thanks.
Because of the size of the boxes, once you change the size of the boxes the size of the picture will change as well